Use `CoordinatorLayout` in `ConnectFragment`

2 files changed, 171 insertions, 181 deletions

diff --git a/android/src/main/kotlin/net/mullvad/mullvadvpn/ui/ConnectFragment.kt b/android/src/main/kotlin/net/mullvad/mullvadvpn/ui/ConnectFragment.kt
index 1ef0b3ac62..550edd7e26 100644
--- a/android/src/main/kotlin/net/mullvad/mullvadvpn/ui/ConnectFragment.kt
+++ b/android/src/main/kotlin/net/mullvad/mullvadvpn/ui/ConnectFragment.kt
@@ -16,7 +16,6 @@ class ConnectFragment : ServiceDependentFragment(OnNoService.GoToLaunchScreen) {
     private lateinit var actionButton: ConnectActionButton
     private lateinit var switchLocationButton: SwitchLocationButton
     private lateinit var headerBar: HeaderBar
-    private lateinit var body: View
     private lateinit var notificationBanner: NotificationBanner
     private lateinit var status: ConnectionStatus
     private lateinit var locationInfo: LocationInfo
@@ -44,10 +43,7 @@ class ConnectFragment : ServiceDependentFragment(OnNoService.GoToLaunchScreen) {
 
         headerBar = HeaderBar(view, resources)
 
-        body = view.findViewById(R.id.body)
-
         notificationBanner = NotificationBanner(view, parentActivity, appVersionInfoCache, daemon)
-        notificationBanner.onHeightChange = { newHeight -> updateBodyPaddingTop(newHeight) }
 
         status = ConnectionStatus(view, resources)
 
@@ -131,14 +127,6 @@ class ConnectFragment : ServiceDependentFragment(OnNoService.GoToLaunchScreen) {
         state.putBoolean(KEY_IS_TUNNEL_INFO_EXPANDED, isTunnelInfoExpanded)
     }
 
-    private fun updateBodyPaddingTop(newPaddingTop: Int) {
-        body.apply {
-            if (paddingTop != newPaddingTop) {
-                setPadding(paddingLeft, newPaddingTop, paddingRight, paddingBottom)
-            }
-        }
-    }
-
     private fun updateTunnelState(uiState: TunnelState, realState: TunnelState) {
         notificationBanner.tunnelState = realState
         locationInfo.state = realState
diff --git a/android/src/main/res/layout/connect.xml b/android/src/main/res/layout/connect.xml
index c1daa9f950..9e33f21f1e 100644
--- a/android/src/main/res/layout/connect.xml
+++ b/android/src/main/res/layout/connect.xml
@@ -1,10 +1,11 @@
-<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
-                android:layout_width="match_parent"
-                android:layout_height="match_parent">
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+              xmlns:app="http://schemas.android.com/apk/res-auto"
+              android:layout_width="match_parent"
+              android:layout_height="match_parent"
+              android:orientation="vertical">
     <LinearLayout android:id="@+id/header_bar"
                   android:layout_width="match_parent"
                   android:layout_height="wrap_content"
-                  android:layout_alignParentTop="true"
                   android:orientation="horizontal"
                   android:gravity="center_vertical"
                   android:background="@color/red"
@@ -33,193 +34,194 @@
                      android:background="?android:attr/selectableItemBackground"
                      android:src="@drawable/icon_settings" />
     </LinearLayout>
-    <FrameLayout android:id="@+id/notification_banner"
-                 android:layout_width="match_parent"
-                 android:layout_height="wrap_content"
-                 android:layout_below="@id/header_bar"
-                 android:background="@color/darkBlue"
-                 android:visibility="invisible"
-                 android:clickable="false"
-                 android:elevation="0.25dp">
-        <RelativeLayout android:layout_width="match_parent"
-                        android:layout_height="wrap_content"
-                        android:paddingVertical="8dp"
-                        android:paddingLeft="20dp"
-                        android:paddingRight="10dp"
-                        android:background="?android:attr/selectableItemBackground">
-            <RelativeLayout android:id="@+id/notification_status_container"
-                            android:layout_width="wrap_content"
+    <android.support.design.widget.CoordinatorLayout android:layout_width="match_parent"
+                                                     android:layout_height="match_parent">
+        <FrameLayout android:id="@+id/notification_banner"
+                     android:layout_width="match_parent"
+                     android:layout_height="wrap_content"
+                     android:background="@color/darkBlue"
+                     android:visibility="invisible"
+                     android:clickable="false"
+                     android:elevation="0.25dp">
+            <RelativeLayout android:layout_width="match_parent"
                             android:layout_height="wrap_content"
-                            android:layout_alignParentTop="true"
-                            android:layout_alignParentLeft="true"
-                            android:layout_alignBottom="@id/notification_title">
-                <ImageView android:id="@+id/notification_status"
-                           android:layout_width="wrap_content"
-                           android:layout_height="wrap_content"
-                           android:layout_centerInParent="true"
-                           android:src="@drawable/icon_notification_error" />
-            </RelativeLayout>
-            <TextView android:id="@+id/notification_title"
-                      android:layout_width="wrap_content"
-                      android:layout_height="wrap_content"
-                      android:layout_alignParentTop="true"
-                      android:layout_toLeftOf="@id/notification_icon"
-                      android:layout_toRightOf="@id/notification_status_container"
-                      android:layout_marginLeft="7dp"
-                      android:textSize="13sp"
-                      android:textStyle="bold"
-                      android:text="@string/blocking_internet"
-                      android:textAllCaps="true" />
-            <TextView android:id="@+id/notification_message"
-                      android:layout_width="wrap_content"
-                      android:layout_height="wrap_content"
-                      android:layout_alignWithParentIfMissing="true"
-                      android:layout_toLeftOf="@id/notification_icon"
-                      android:layout_alignLeft="@id/notification_title"
-                      android:layout_below="@id/notification_title"
-                      android:textSize="13sp"
-                      android:textColor="@color/white60"
-                      android:text=""
-                      android:visibility="gone" />
-            <ImageView android:id="@+id/notification_icon"
-                       android:layout_width="12dp"
-                       android:layout_height="12dp"
-                       android:layout_alignParentRight="true"
-                       android:layout_centerVertical="true"
-                       android:alpha="0.6"
-                       android:src="@drawable/icon_extlink"
-                       android:visibility="gone" />
-        </RelativeLayout>
-    </FrameLayout>
-    <ScrollView android:layout_width="match_parent"
-                android:layout_height="wrap_content"
-                android:layout_below="@id/header_bar"
-                android:layout_alignParentBottom="true"
-                android:fillViewport="true">
-        <LinearLayout android:id="@+id/body"
-                      android:layout_width="match_parent"
-                      android:layout_height="match_parent"
-                      android:orientation="vertical"
-                      android:gravity="bottom">
-            <ProgressBar android:id="@+id/connecting_spinner"
-                         android:layout_width="60dp"
-                         android:layout_height="60dp"
-                         android:layout_gravity="center"
-                         android:layout_marginBottom="7dp"
-                         android:indeterminate="true"
-                         android:indeterminateOnly="true"
-                         android:indeterminateDuration="600"
-                         android:indeterminateDrawable="@drawable/icon_spinner"
-                         android:visibility="invisible" />
-            <LinearLayout android:layout_width="match_parent"
-                          android:layout_height="wrap_content"
-                          android:layout_weight="0"
-                          android:layout_marginTop="7dp"
-                          android:orientation="vertical"
-                          android:gravity="start">
-                <TextView android:id="@+id/connection_status"
+                            android:paddingVertical="8dp"
+                            android:paddingLeft="20dp"
+                            android:paddingRight="10dp"
+                            android:background="?android:attr/selectableItemBackground">
+                <RelativeLayout android:id="@+id/notification_status_container"
+                                android:layout_width="wrap_content"
+                                android:layout_height="wrap_content"
+                                android:layout_alignParentTop="true"
+                                android:layout_alignParentLeft="true"
+                                android:layout_alignBottom="@id/notification_title">
+                    <ImageView android:id="@+id/notification_status"
+                               android:layout_width="wrap_content"
+                               android:layout_height="wrap_content"
+                               android:layout_centerInParent="true"
+                               android:src="@drawable/icon_notification_error" />
+                </RelativeLayout>
+                <TextView android:id="@+id/notification_title"
                           android:layout_width="wrap_content"
                           android:layout_height="wrap_content"
-                          android:layout_marginBottom="4dp"
-                          android:layout_marginHorizontal="24dp"
-                          android:textColor="@color/red"
-                          android:textSize="16sp"
+                          android:layout_alignParentTop="true"
+                          android:layout_toLeftOf="@id/notification_icon"
+                          android:layout_toRightOf="@id/notification_status_container"
+                          android:layout_marginLeft="7dp"
+                          android:textSize="13sp"
                           android:textStyle="bold"
-                          android:text="@string/unsecured_connection"
+                          android:text="@string/blocking_internet"
                           android:textAllCaps="true" />
-                <TextView android:id="@+id/city"
+                <TextView android:id="@+id/notification_message"
                           android:layout_width="wrap_content"
                           android:layout_height="wrap_content"
-                          android:layout_marginHorizontal="24dp"
-                          android:textColor="@color/white"
-                          android:textSize="34sp"
-                          android:textStyle="bold"
-                          android:text="" />
-                <TextView android:id="@+id/country"
-                          android:layout_width="wrap_content"
-                          android:layout_height="wrap_content"
-                          android:layout_marginHorizontal="24dp"
-                          android:textColor="@color/white"
-                          android:textSize="34sp"
-                          android:textStyle="bold"
-                          android:text="" />
-                <LinearLayout android:id="@+id/tunnel_info"
-                              android:layout_width="match_parent"
+                          android:layout_alignWithParentIfMissing="true"
+                          android:layout_toLeftOf="@id/notification_icon"
+                          android:layout_alignLeft="@id/notification_title"
+                          android:layout_below="@id/notification_title"
+                          android:textSize="13sp"
+                          android:textColor="@color/white60"
+                          android:text=""
+                          android:visibility="gone" />
+                <ImageView android:id="@+id/notification_icon"
+                           android:layout_width="12dp"
+                           android:layout_height="12dp"
+                           android:layout_alignParentRight="true"
+                           android:layout_centerVertical="true"
+                           android:alpha="0.6"
+                           android:src="@drawable/icon_extlink"
+                           android:visibility="gone" />
+            </RelativeLayout>
+        </FrameLayout>
+        <ScrollView android:id="@+id/body"
+                    android:layout_width="match_parent"
+                    android:layout_height="match_parent"
+                    app:layout_behavior="net.mullvad.mullvadvpn.ui.UnderNotificationBannerBehavior"
+                    android:fillViewport="true">
+            <LinearLayout android:layout_width="match_parent"
+                          android:layout_height="match_parent"
+                          android:orientation="vertical"
+                          android:gravity="bottom">
+                <ProgressBar android:id="@+id/connecting_spinner"
+                             android:layout_width="60dp"
+                             android:layout_height="60dp"
+                             android:layout_gravity="center"
+                             android:layout_marginBottom="7dp"
+                             android:indeterminate="true"
+                             android:indeterminateOnly="true"
+                             android:indeterminateDuration="600"
+                             android:indeterminateDrawable="@drawable/icon_spinner"
+                             android:visibility="invisible" />
+                <LinearLayout android:layout_width="match_parent"
                               android:layout_height="wrap_content"
                               android:layout_weight="0"
+                              android:layout_marginTop="7dp"
                               android:orientation="vertical"
-                              android:paddingHorizontal="24dp"
-                              android:gravity="start"
-                              android:clickable="true"
-                              android:background="?android:attr/selectableItemBackground">
-                    <LinearLayout android:layout_width="wrap_content"
-                                  android:layout_height="wrap_content"
-                                  android:orientation="horizontal">
-                        <TextView android:id="@+id/hostname"
-                                  android:layout_width="wrap_content"
-                                  android:layout_height="wrap_content"
-                                  android:textColor="@color/white"
-                                  android:textSize="16sp"
-                                  android:textStyle="bold"
-                                  android:text="" />
-                        <ImageView android:id="@+id/chevron"
-                                   android:layout_width="wrap_content"
-                                   android:layout_height="wrap_content"
-                                   android:layout_marginHorizontal="5dp"
-                                   android:alpha="0.4"
-                                   android:src="@drawable/icon_chevron_expand" />
-                    </LinearLayout>
-                    <TextView android:id="@+id/tunnel_protocol"
+                              android:gravity="start">
+                    <TextView android:id="@+id/connection_status"
                               android:layout_width="wrap_content"
                               android:layout_height="wrap_content"
-                              android:layout_marginTop="4dp"
-                              android:textColor="@color/white"
-                              android:textSize="13sp"
-                              android:text="" />
-                    <TextView android:id="@+id/in_address"
+                              android:layout_marginBottom="4dp"
+                              android:layout_marginHorizontal="24dp"
+                              android:textColor="@color/red"
+                              android:textSize="16sp"
+                              android:textStyle="bold"
+                              android:text="@string/unsecured_connection"
+                              android:textAllCaps="true" />
+                    <TextView android:id="@+id/city"
                               android:layout_width="wrap_content"
                               android:layout_height="wrap_content"
+                              android:layout_marginHorizontal="24dp"
                               android:textColor="@color/white"
-                              android:textSize="13sp"
+                              android:textSize="34sp"
+                              android:textStyle="bold"
                               android:text="" />
-                    <TextView android:id="@+id/out_address"
+                    <TextView android:id="@+id/country"
                               android:layout_width="wrap_content"
                               android:layout_height="wrap_content"
+                              android:layout_marginHorizontal="24dp"
                               android:textColor="@color/white"
-                              android:textSize="13sp"
+                              android:textSize="34sp"
+                              android:textStyle="bold"
                               android:text="" />
+                    <LinearLayout android:id="@+id/tunnel_info"
+                                  android:layout_width="match_parent"
+                                  android:layout_height="wrap_content"
+                                  android:layout_weight="0"
+                                  android:orientation="vertical"
+                                  android:paddingHorizontal="24dp"
+                                  android:gravity="start"
+                                  android:clickable="true"
+                                  android:background="?android:attr/selectableItemBackground">
+                        <LinearLayout android:layout_width="wrap_content"
+                                      android:layout_height="wrap_content"
+                                      android:orientation="horizontal">
+                            <TextView android:id="@+id/hostname"
+                                      android:layout_width="wrap_content"
+                                      android:layout_height="wrap_content"
+                                      android:textColor="@color/white"
+                                      android:textSize="16sp"
+                                      android:textStyle="bold"
+                                      android:text="" />
+                            <ImageView android:id="@+id/chevron"
+                                       android:layout_width="wrap_content"
+                                       android:layout_height="wrap_content"
+                                       android:layout_marginHorizontal="5dp"
+                                       android:alpha="0.4"
+                                       android:src="@drawable/icon_chevron_expand" />
+                        </LinearLayout>
+                        <TextView android:id="@+id/tunnel_protocol"
+                                  android:layout_width="wrap_content"
+                                  android:layout_height="wrap_content"
+                                  android:layout_marginTop="4dp"
+                                  android:textColor="@color/white"
+                                  android:textSize="13sp"
+                                  android:text="" />
+                        <TextView android:id="@+id/in_address"
+                                  android:layout_width="wrap_content"
+                                  android:layout_height="wrap_content"
+                                  android:textColor="@color/white"
+                                  android:textSize="13sp"
+                                  android:text="" />
+                        <TextView android:id="@+id/out_address"
+                                  android:layout_width="wrap_content"
+                                  android:layout_height="wrap_content"
+                                  android:textColor="@color/white"
+                                  android:textSize="13sp"
+                                  android:text="" />
+                    </LinearLayout>
                 </LinearLayout>
-            </LinearLayout>
-            <LinearLayout android:layout_width="match_parent"
-                          android:layout_height="wrap_content"
-                          android:layout_weight="0"
-                          android:orientation="vertical"
-                          android:padding="24dp">
-                <Button android:id="@+id/switch_location"
-                        android:layout_marginTop="20dp"
-                        android:layout_marginBottom="16dp"
-                        android:paddingHorizontal="8dp"
-                        android:text="@string/switch_location"
-                        android:drawableRight="@drawable/icon_chevron"
-                        style="@style/White20Button" />
                 <LinearLayout android:layout_width="match_parent"
                               android:layout_height="wrap_content"
-                              android:orientation="horizontal">
-                    <Button android:id="@+id/action_button"
-                            android:layout_weight="1"
-                            android:text="@string/connect"
-                            style="@style/GreenButton" />
-                    <ImageButton android:id="@+id/reconnect_button"
-                                 android:layout_width="wrap_content"
-                                 android:layout_height="match_parent"
-                                 android:layout_weight="0"
-                                 android:layout_marginLeft="1dp"
-                                 android:paddingHorizontal="10dp"
-                                 android:background="@drawable/transparent_red_right_half_button_background"
-                                 android:visibility="gone"
-                                 android:src="@drawable/icon_reload" />
+                              android:layout_weight="0"
+                              android:orientation="vertical"
+                              android:padding="24dp">
+                    <Button android:id="@+id/switch_location"
+                            android:layout_marginTop="20dp"
+                            android:layout_marginBottom="16dp"
+                            android:paddingHorizontal="8dp"
+                            android:text="@string/switch_location"
+                            android:drawableRight="@drawable/icon_chevron"
+                            style="@style/White20Button" />
+                    <LinearLayout android:layout_width="match_parent"
+                                  android:layout_height="wrap_content"
+                                  android:orientation="horizontal">
+                        <Button android:id="@+id/action_button"
+                                android:layout_weight="1"
+                                android:text="@string/connect"
+                                style="@style/GreenButton" />
+                        <ImageButton android:id="@+id/reconnect_button"
+                                     android:layout_width="wrap_content"
+                                     android:layout_height="match_parent"
+                                     android:layout_weight="0"
+                                     android:layout_marginLeft="1dp"
+                                     android:paddingHorizontal="10dp"
+                                     android:background="@drawable/transparent_red_right_half_button_background"
+                                     android:visibility="gone"
+                                     android:src="@drawable/icon_reload" />
+                    </LinearLayout>
                 </LinearLayout>
             </LinearLayout>
-        </LinearLayout>
-    </ScrollView>
-</RelativeLayout>
+        </ScrollView>
+    </android.support.design.widget.CoordinatorLayout>
+</LinearLayout>