Combine transfer data graphics to reduce layout complexity

and make scaling work better on smaller screens
2026-02-14 11:49:04 +01:00 · 2021-06-29 17:45:12 -03:00
parent eee9e1a488
commit ccb4f88b89
16 changed files with 418 additions and 330 deletions
--- a/briar-android/src/main/java/org/briarproject/briar/android/fragment/FinalFragment.java
+++ b/briar-android/src/main/java/org/briarproject/briar/android/fragment/FinalFragment.java
@@ -7,6 +7,7 @@ import android.view.View;
 import android.view.ViewGroup;
 import android.widget.Button;
 import android.widget.ImageView;
+import android.widget.ScrollView;
 import android.widget.TextView;

 import org.briarproject.bramble.api.nullsafety.MethodsNotNullByDefault;
@@ -23,6 +24,8 @@ import androidx.appcompat.app.AppCompatActivity;
 import androidx.core.widget.ImageViewCompat;
 import androidx.fragment.app.Fragment;

+import static android.view.View.FOCUS_DOWN;
+
 /**
 * A fragment to be used at the end of a user flow
 * where the user should not have the option to go back.
@@ -55,6 +58,7 @@ public class FinalFragment extends Fragment {
 		return f;
 	}

+	private ScrollView scrollView;
 	protected Button buttonView;

 	@Nullable
@@ -65,6 +69,7 @@ public class FinalFragment extends Fragment {
 		View v = inflater
 				.inflate(R.layout.fragment_final, container, false);

+		scrollView = (ScrollView) v;
 		ImageView iconView = v.findViewById(R.id.iconView);
 		TextView titleView = v.findViewById(R.id.titleView);
 		TextView textView = v.findViewById(R.id.textView);
@@ -97,6 +102,13 @@ public class FinalFragment extends Fragment {
 		return v;
 	}

+	@Override
+	public void onStart() {
+		super.onStart();
+		// Scroll down in case the screen is small, so the button is visible
+		scrollView.post(() -> scrollView.fullScroll(FOCUS_DOWN));
+	}
+
 	/**
 	 * This is the action that the system back button
 	 * and the button at the bottom will perform.
--- a/briar-android/src/main/java/org/briarproject/briar/android/removabledrive/ChooserFragment.java
+++ b/briar-android/src/main/java/org/briarproject/briar/android/removabledrive/ChooserFragment.java
@@ -6,6 +6,7 @@ import android.view.LayoutInflater;
 import android.view.View;
 import android.view.ViewGroup;
 import android.widget.Button;
+import android.widget.ScrollView;

 import org.briarproject.bramble.api.nullsafety.MethodsNotNullByDefault;
 import org.briarproject.bramble.api.nullsafety.ParametersNotNullByDefault;
@@ -18,6 +19,7 @@ import androidx.fragment.app.Fragment;
 import androidx.fragment.app.FragmentActivity;
 import androidx.lifecycle.ViewModelProvider;

+import static android.view.View.FOCUS_DOWN;
 import static org.briarproject.briar.android.AppModule.getAndroidComponent;

@MethodsNotNullByDefault
@@ -30,6 +32,7 @@ public class ChooserFragment extends Fragment {
 	ViewModelProvider.Factory viewModelFactory;

 	private RemovableDriveViewModel viewModel;
+	private ScrollView scrollView;

 	@Override
 	public void onAttach(Context context) {
@@ -47,6 +50,7 @@ public class ChooserFragment extends Fragment {
 		View v = inflater.inflate(R.layout.fragment_transfer_data_chooser,
 				container, false);

+		scrollView = (ScrollView) v;
 		Button sendButton = v.findViewById(R.id.sendButton);
 		sendButton.setOnClickListener(i -> viewModel.startSendData());

@@ -65,6 +69,9 @@ public class ChooserFragment extends Fragment {
 			// we can't come back here now to start another task
 			// as we only support one per ViewModel instance
 			requireActivity().supportFinishAfterTransition();
+		} else {
+			// Scroll down in case the screen is small, so the button is visible
+			scrollView.post(() -> scrollView.fullScroll(FOCUS_DOWN));
 		}
 	}

--- a/briar-android/src/main/java/org/briarproject/briar/android/removabledrive/ReceiveFragment.java
+++ b/briar-android/src/main/java/org/briarproject/briar/android/removabledrive/ReceiveFragment.java
@@ -8,7 +8,7 @@ import android.view.View;
 import android.view.ViewGroup;
 import android.widget.Button;
 import android.widget.ProgressBar;
-import android.widget.TextView;
+import android.widget.ScrollView;
 import android.widget.Toast;

 import org.briarproject.bramble.api.nullsafety.MethodsNotNullByDefault;
@@ -24,6 +24,7 @@ import androidx.fragment.app.Fragment;
 import androidx.fragment.app.FragmentActivity;
 import androidx.lifecycle.ViewModelProvider;

+import static android.view.View.FOCUS_DOWN;
 import static android.view.View.VISIBLE;
 import static android.widget.Toast.LENGTH_LONG;
 import static org.briarproject.briar.android.AppModule.getAndroidComponent;
@@ -41,10 +42,10 @@ public class ReceiveFragment extends Fragment {
 	@Inject
 	ViewModelProvider.Factory viewModelFactory;

-	RemovableDriveViewModel viewModel;
-	TextView introTextView;
-	Button button;
-	ProgressBar progressBar;
+	private RemovableDriveViewModel viewModel;
+	private ScrollView scrollView;
+	private Button button;
+	private ProgressBar progressBar;

 	@Override
 	public void onAttach(Context context) {
@@ -62,7 +63,7 @@ public class ReceiveFragment extends Fragment {
 		View v = inflater.inflate(R.layout.fragment_transfer_data_receive,
 				container, false);

-		introTextView = v.findViewById(R.id.introTextView);
+		scrollView = (ScrollView) v;
 		progressBar = v.findViewById(R.id.progressBar);
 		button = v.findViewById(R.id.fileButton);
 		button.setOnClickListener(view ->
@@ -79,6 +80,8 @@ public class ReceiveFragment extends Fragment {
 	public void onStart() {
 		super.onStart();
 		requireActivity().setTitle(R.string.removable_drive_title_receive);
+		// Scroll down in case the screen is small, so the button is visible
+		scrollView.post(() -> scrollView.fullScroll(FOCUS_DOWN));
 	}

 	private void onOldTaskResumed(boolean resumed) {
--- a/briar-android/src/main/java/org/briarproject/briar/android/removabledrive/SendFragment.java
+++ b/briar-android/src/main/java/org/briarproject/briar/android/removabledrive/SendFragment.java
@@ -8,6 +8,7 @@ import android.view.View;
 import android.view.ViewGroup;
 import android.widget.Button;
 import android.widget.ProgressBar;
+import android.widget.ScrollView;
 import android.widget.TextView;
 import android.widget.Toast;

@@ -26,6 +27,7 @@ import androidx.fragment.app.FragmentActivity;
 import androidx.lifecycle.ViewModelProvider;

 import static android.os.Build.VERSION.SDK_INT;
+import static android.view.View.FOCUS_DOWN;
 import static android.view.View.VISIBLE;
 import static android.widget.Toast.LENGTH_LONG;
 import static org.briarproject.briar.android.AppModule.getAndroidComponent;
@@ -43,10 +45,11 @@ public class SendFragment extends Fragment {
 	@Inject
 	ViewModelProvider.Factory viewModelFactory;

-	RemovableDriveViewModel viewModel;
-	TextView introTextView;
-	Button button;
-	ProgressBar progressBar;
+	private RemovableDriveViewModel viewModel;
+	private ScrollView scrollView;
+	private TextView introTextView;
+	private Button button;
+	private ProgressBar progressBar;

 	@Override
 	public void onAttach(Context context) {
@@ -64,6 +67,7 @@ public class SendFragment extends Fragment {
 		View v = inflater.inflate(R.layout.fragment_transfer_data_send,
 				container, false);

+		scrollView = (ScrollView) v;
 		introTextView = v.findViewById(R.id.introTextView);
 		progressBar = v.findViewById(R.id.progressBar);
 		button = v.findViewById(R.id.fileButton);
@@ -83,6 +87,8 @@ public class SendFragment extends Fragment {
 	public void onStart() {
 		super.onStart();
 		requireActivity().setTitle(R.string.removable_drive_title_send);
+		// Scroll down in case the screen is small, so the button is visible
+		scrollView.post(() -> scrollView.fullScroll(FOCUS_DOWN));
 	}

 	private void onOldTaskResumed(boolean resumed) {
--- a/briar-android/src/main/res/drawable/ic_arrow_forward.xml
+++ b/briar-android/src/main/res/drawable/ic_arrow_forward.xml
@@ -1,11 +0,0 @@
-<vector xmlns:android="http://schemas.android.com/apk/res/android"
-	android:width="24dp"
-	android:height="24dp"
-	android:autoMirrored="true"
-	android:tint="?attr/colorControlNormal"
-	android:viewportWidth="24"
-	android:viewportHeight="24">
-	<path
-		android:fillColor="@android:color/white"
-		android:pathData="M12,4l-1.41,1.41L16.17,11H4v2h12.17l-5.58,5.59L12,20l8,-8z" />
-</vector>
--- a/briar-android/src/main/res/drawable/ic_flash_drive.xml
+++ b/briar-android/src/main/res/drawable/ic_flash_drive.xml
@@ -1,10 +0,0 @@
-<vector xmlns:android="http://schemas.android.com/apk/res/android"
-	android:width="24dp"
-	android:height="24dp"
-	android:tint="?attr/colorControlNormal"
-	android:viewportWidth="24"
-	android:viewportHeight="24">
-	<path
-		android:fillColor="@android:color/white"
-		android:pathData="m5.9996,0.0002c-0.5304,0 -1.0388,0.2109 -1.4138,0.5859C4.2106,0.9612 3.9998,1.4696 3.9998,2v8.9996c-0.5304,0 -1.0388,0.2109 -1.4138,0.5859 -0.3751,0.3751 -0.5859,0.8845 -0.5859,1.4149L2,23.9998L3.9998,23.9998L3.9998,13.0004L20.0002,13.0004L20.0002,23.9998L22,23.9998L22,13.0004c0,-0.5304 -0.2109,-1.0398 -0.5859,-1.4149 -0.3751,-0.3751 -0.8834,-0.5859 -1.4138,-0.5859L20.0002,2c0,-0.5304 -0.2109,-1.0388 -0.5859,-1.4138C19.0392,0.2111 18.5309,0.0002 18.0004,0.0002ZM5.9996,2L18.0004,2L18.0004,10.9996L5.9996,10.9996ZM8.0004,5.9996L8.0004,8.0004L10.9996,8.0004L10.9996,5.9996ZM13.0004,5.9996v2.0009h2.9991L15.9996,5.9996Z" />
-</vector>
--- a/briar-android/src/main/res/drawable/ic_phone_android.xml
+++ b/briar-android/src/main/res/drawable/ic_phone_android.xml
@@ -1,10 +0,0 @@
-<vector xmlns:android="http://schemas.android.com/apk/res/android"
-	android:width="24dp"
-	android:height="24dp"
-	android:tint="?attr/colorControlNormal"
-	android:viewportWidth="24"
-	android:viewportHeight="24">
-	<path
-		android:fillColor="@android:color/white"
-		android:pathData="M16,1L8,1C6.34,1 5,2.34 5,4v16c0,1.66 1.34,3 3,3h8c1.66,0 3,-1.34 3,-3L19,4c0,-1.66 -1.34,-3 -3,-3zM14,21h-4v-1h4v1zM17.25,18L6.75,18L6.75,4h10.5v14z" />
-</vector>
--- a/briar-android/src/main/res/drawable/ic_transfer_data_receive.xml
+++ b/briar-android/src/main/res/drawable/ic_transfer_data_receive.xml
@@ -0,0 +1,15 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+	android:width="120dp"
+	android:height="52dp"
+	android:viewportWidth="120"
+	android:viewportHeight="52">
+	<path
+		android:fillColor="?attr/colorControlNormal"
+		android:pathData="m15.975,14.267c-0.596,0 -1.168,0.238 -1.589,0.659 -0.422,0.421 -0.659,0.993 -0.659,1.589v10.111c-0.596,0 -1.166,0.236 -1.587,0.658 -0.422,0.421 -0.659,0.993 -0.659,1.589v12.359h2.247v-12.359h17.977v12.359h2.247L33.951,28.873c0,-0.596 -0.236,-1.168 -0.658,-1.589 -0.421,-0.422 -0.993,-0.658 -1.589,-0.658L31.704,16.515c0,-0.596 -0.238,-1.168 -0.659,-1.589 -0.421,-0.422 -0.993,-0.659 -1.589,-0.659zM15.975,16.515L29.456,16.515L29.456,26.626L15.975,26.626ZM18.222,18.739v2.247h3.37v-2.247zM23.84,18.739v2.247h3.37v-2.247z" />
+	<path
+		android:fillColor="@color/briar_brand_green"
+		android:pathData="m47.828,24.463v3.074h18.443l-8.453,8.453 2.182,2.182 12.172,-12.172 -12.172,-12.172 -2.182,2.182 8.453,8.453z" />
+	<path
+		android:fillColor="?attr/colorControlNormal"
+		android:pathData="M93.999,0C92.275,0 90.624,0.686 89.405,1.905 88.186,3.124 87.501,4.776 87.501,6.5L87.501,45.498c0,1.724 0.686,3.379 1.905,4.598C90.624,51.314 92.275,52 93.999,52h19.501c1.724,0 3.377,-0.686 4.596,-1.905C119.314,48.877 120,47.222 120,45.498L120,6.5C120,4.776 119.314,3.124 118.095,1.905 116.877,0.686 115.224,0 113.5,0ZM93.999,3.252h19.501c0.862,0 1.689,0.34 2.299,0.949 0.609,0.609 0.951,1.437 0.951,2.299L116.75,45.498c0,0.862 -0.342,1.689 -0.951,2.299 -0.609,0.609 -1.437,0.953 -2.299,0.953L93.999,48.75c-0.862,0 -1.687,-0.344 -2.297,-0.953 -0.609,-0.61 -0.951,-1.437 -0.951,-2.299L90.751,6.5c0,-0.862 0.342,-1.689 0.951,-2.299 0.61,-0.609 1.435,-0.949 2.297,-0.949zM103.749,36.016c-0.862,0 -1.687,0.342 -2.297,0.951 -0.609,0.61 -0.953,1.437 -0.953,2.299 0,0.862 0.344,1.687 0.953,2.297 0.609,0.61 1.435,0.951 2.297,0.951 0.862,0 1.689,-0.342 2.299,-0.951 0.609,-0.609 0.951,-1.435 0.951,-2.297 0,-0.862 -0.342,-1.689 -0.951,-2.299 -0.61,-0.609 -1.437,-0.951 -2.299,-0.951z" />
+</vector>
--- a/briar-android/src/main/res/drawable/ic_transfer_data_send.xml
+++ b/briar-android/src/main/res/drawable/ic_transfer_data_send.xml
@@ -0,0 +1,15 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+	android:width="120dp"
+	android:height="52dp"
+	android:viewportWidth="120"
+	android:viewportHeight="52">
+	<path
+		android:fillColor="?attr/colorControlNormal"
+		android:pathData="m91.223,12.31c-0.596,0 -1.168,0.238 -1.589,0.659 -0.422,0.421 -0.659,0.993 -0.659,1.589v10.111c-0.596,0 -1.166,0.236 -1.587,0.658 -0.422,0.421 -0.659,0.993 -0.659,1.589v12.359h2.247v-12.359h17.977v12.359h2.247L109.199,26.916c0,-0.596 -0.236,-1.168 -0.658,-1.589 -0.421,-0.422 -0.993,-0.658 -1.589,-0.658L106.952,14.558c0,-0.596 -0.238,-1.168 -0.659,-1.589 -0.421,-0.422 -0.993,-0.659 -1.589,-0.659zM91.223,14.558L104.704,14.558L104.704,24.669L91.223,24.669ZM93.47,16.782v2.247h3.37v-2.247zM99.088,16.782v2.247h3.37v-2.247z" />
+	<path
+		android:fillColor="@color/briar_brand_green"
+		android:pathData="m47.828,24.463v3.074h18.443l-8.453,8.453 2.182,2.182 12.172,-12.172 -12.172,-12.172 -2.182,2.182 8.453,8.453z" />
+	<path
+		android:fillColor="?attr/colorControlNormal"
+		android:pathData="M6.498,0C4.774,0 3.123,0.686 1.905,1.905 0.686,3.124 0,4.776 0,6.5L0,45.498c0,1.724 0.686,3.379 1.905,4.598C3.123,51.314 4.774,52 6.498,52L25.999,52c1.724,0 3.377,-0.686 4.596,-1.905 1.219,-1.219 1.905,-2.874 1.905,-4.598L32.499,6.5c0,-1.724 -0.686,-3.377 -1.905,-4.596C29.376,0.686 27.723,0 25.999,0ZM6.498,3.252L25.999,3.252c0.862,0 1.689,0.34 2.299,0.949 0.609,0.609 0.951,1.437 0.951,2.299L29.249,45.498c0,0.862 -0.342,1.689 -0.951,2.299 -0.61,0.609 -1.437,0.953 -2.299,0.953L6.498,48.75c-0.862,0 -1.687,-0.344 -2.297,-0.953C3.592,47.187 3.25,46.36 3.25,45.498L3.25,6.5c0,-0.862 0.342,-1.689 0.951,-2.299C4.811,3.592 5.636,3.252 6.498,3.252ZM16.249,36.016c-0.862,0 -1.687,0.342 -2.297,0.951 -0.61,0.61 -0.953,1.437 -0.953,2.299 0,0.862 0.344,1.687 0.953,2.297 0.609,0.61 1.435,0.951 2.297,0.951 0.862,0 1.689,-0.342 2.299,-0.951 0.609,-0.609 0.951,-1.435 0.951,-2.297 0,-0.862 -0.342,-1.689 -0.951,-2.299 -0.61,-0.609 -1.437,-0.951 -2.299,-0.951z" />
+</vector>
--- a/briar-android/src/main/res/layout/fragment_final.xml
+++ b/briar-android/src/main/res/layout/fragment_final.xml
@@ -1,66 +1,73 @@
 <?xml version="1.0" encoding="utf-8"?>
-<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
 	xmlns:app="http://schemas.android.com/apk/res-auto"
 	xmlns:tools="http://schemas.android.com/tools"
 	android:layout_width="match_parent"
-	android:layout_height="match_parent">
+	android:layout_height="match_parent"
+	android:fillViewport="true">

-	<ImageView
-		android:id="@+id/iconView"
-		android:layout_width="0dp"
-		android:layout_height="0dp"
-		android:layout_margin="32dp"
-		app:layout_constraintBottom_toTopOf="@+id/titleView"
-		app:layout_constraintDimensionRatio="1:1"
-		app:layout_constraintEnd_toEndOf="parent"
-		app:layout_constraintHeight_max="200dp"
-		app:layout_constraintStart_toStartOf="parent"
-		app:layout_constraintTop_toTopOf="parent"
-		app:layout_constraintVertical_bias="0.25"
-		app:layout_constraintVertical_chainStyle="packed"
-		app:layout_constraintWidth_max="200dp"
-		tools:ignore="ContentDescription"
-		tools:srcCompat="@drawable/alerts_and_states_error"
-		tools:tint="@color/briar_red_500" />
+	<androidx.constraintlayout.widget.ConstraintLayout
+		android:layout_width="match_parent"
+		android:layout_height="wrap_content">

-	<TextView
-		android:id="@+id/titleView"
-		android:layout_width="0dp"
-		android:layout_height="wrap_content"
-		android:layout_marginStart="32dp"
-		android:layout_marginLeft="32dp"
-		android:layout_marginTop="32dp"
-		android:layout_marginEnd="32dp"
-		android:layout_marginRight="32dp"
-		android:gravity="center"
-		android:textAppearance="@style/TextAppearance.MaterialComponents.Headline5"
-		app:layout_constraintBottom_toTopOf="@+id/textView"
-		app:layout_constraintEnd_toEndOf="parent"
-		app:layout_constraintStart_toStartOf="parent"
-		app:layout_constraintTop_toBottomOf="@+id/iconView"
-		tools:text="@string/removable_drive_error_send_title" />
+		<ImageView
+			android:id="@+id/iconView"
+			android:layout_width="0dp"
+			android:layout_height="0dp"
+			android:layout_margin="32dp"
+			app:layout_constraintBottom_toTopOf="@+id/titleView"
+			app:layout_constraintDimensionRatio="1:1"
+			app:layout_constraintEnd_toEndOf="parent"
+			app:layout_constraintHeight_max="200dp"
+			app:layout_constraintStart_toStartOf="parent"
+			app:layout_constraintTop_toTopOf="parent"
+			app:layout_constraintVertical_bias="0.25"
+			app:layout_constraintVertical_chainStyle="packed"
+			app:layout_constraintWidth_max="200dp"
+			tools:ignore="ContentDescription"
+			tools:srcCompat="@drawable/alerts_and_states_error"
+			tools:tint="@color/briar_red_500" />

-	<TextView
-		android:id="@+id/textView"
-		android:layout_width="0dp"
-		android:layout_height="wrap_content"
-		android:layout_margin="32dp"
-		android:textAppearance="@style/TextAppearance.MaterialComponents.Body1"
-		app:layout_constraintBottom_toTopOf="@+id/button"
-		app:layout_constraintEnd_toEndOf="parent"
-		app:layout_constraintStart_toStartOf="parent"
-		app:layout_constraintTop_toBottomOf="@+id/titleView"
-		tools:text="@string/removable_drive_error_send_text" />
+		<TextView
+			android:id="@+id/titleView"
+			android:layout_width="0dp"
+			android:layout_height="wrap_content"
+			android:layout_marginStart="32dp"
+			android:layout_marginLeft="32dp"
+			android:layout_marginTop="32dp"
+			android:layout_marginEnd="32dp"
+			android:layout_marginRight="32dp"
+			android:gravity="center"
+			android:textAppearance="@style/TextAppearance.MaterialComponents.Headline5"
+			app:layout_constraintBottom_toTopOf="@+id/textView"
+			app:layout_constraintEnd_toEndOf="parent"
+			app:layout_constraintStart_toStartOf="parent"
+			app:layout_constraintTop_toBottomOf="@+id/iconView"
+			tools:text="@string/removable_drive_error_send_title" />

-	<Button
-		android:id="@+id/button"
-		style="@style/BriarButton"
-		android:layout_width="0dp"
-		android:layout_height="wrap_content"
-		android:layout_margin="16dp"
-		android:text="@string/finish"
-		app:layout_constraintBottom_toBottomOf="parent"
-		app:layout_constraintEnd_toEndOf="parent"
-		app:layout_constraintStart_toStartOf="parent" />
+		<TextView
+			android:id="@+id/textView"
+			android:layout_width="0dp"
+			android:layout_height="wrap_content"
+			android:layout_margin="32dp"
+			android:textAppearance="@style/TextAppearance.MaterialComponents.Body1"
+			app:layout_constraintBottom_toTopOf="@+id/button"
+			app:layout_constraintEnd_toEndOf="parent"
+			app:layout_constraintStart_toStartOf="parent"
+			app:layout_constraintTop_toBottomOf="@+id/titleView"
+			tools:text="@string/removable_drive_error_send_text" />

-</androidx.constraintlayout.widget.ConstraintLayout>
+		<Button
+			android:id="@+id/button"
+			style="@style/BriarButton"
+			android:layout_width="0dp"
+			android:layout_height="wrap_content"
+			android:layout_margin="16dp"
+			android:text="@string/finish"
+			app:layout_constraintBottom_toBottomOf="parent"
+			app:layout_constraintEnd_toEndOf="parent"
+			app:layout_constraintStart_toStartOf="parent" />
+
+	</androidx.constraintlayout.widget.ConstraintLayout>
+
+</ScrollView>
--- a/briar-android/src/main/res/layout/fragment_transfer_data_chooser.xml
+++ b/briar-android/src/main/res/layout/fragment_transfer_data_chooser.xml
@@ -1,58 +1,66 @@
 <?xml version="1.0" encoding="utf-8"?>
-<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
 	xmlns:app="http://schemas.android.com/apk/res-auto"
 	xmlns:tools="http://schemas.android.com/tools"
 	android:layout_width="match_parent"
-	android:layout_height="match_parent">
+	android:layout_height="match_parent"
+	android:fillViewport="true">

-	<ImageView
-		android:id="@+id/imageView"
-		android:layout_width="0dp"
-		android:layout_height="0dp"
-		android:layout_marginLeft="32dp"
-		android:layout_marginTop="32dp"
-		android:layout_marginRight="32dp"
-		app:layout_constraintBottom_toTopOf="@+id/introView"
-		app:layout_constraintEnd_toEndOf="parent"
-		app:layout_constraintHeight_max="200dp"
-		app:layout_constraintStart_toStartOf="parent"
-		app:layout_constraintTop_toTopOf="parent"
-		app:layout_constraintVertical_chainStyle="spread"
-		app:srcCompat="@drawable/ic_transfer_data"
-		tools:ignore="ContentDescription" />
+	<androidx.constraintlayout.widget.ConstraintLayout
+		android:layout_width="match_parent"
+		android:layout_height="wrap_content">

-	<TextView
-		android:id="@+id/introView"
-		android:layout_width="0dp"
-		android:layout_height="wrap_content"
-		android:layout_margin="32dp"
-		android:text="@string/removable_drive_intro"
-		android:textSize="16sp"
-		app:layout_constraintBottom_toTopOf="@+id/sendButton"
-		app:layout_constraintEnd_toEndOf="parent"
-		app:layout_constraintStart_toStartOf="parent"
-		app:layout_constraintTop_toBottomOf="@+id/imageView" />
+		<ImageView
+			android:id="@+id/imageView"
+			android:layout_width="0dp"
+			android:layout_height="0dp"
+			android:layout_marginLeft="32dp"
+			android:layout_marginTop="32dp"
+			android:layout_marginRight="32dp"
+			app:layout_constraintBottom_toTopOf="@+id/introView"
+			app:layout_constraintDimensionRatio="1,1"
+			app:layout_constraintEnd_toEndOf="parent"
+			app:layout_constraintHeight_max="200dp"
+			app:layout_constraintStart_toStartOf="parent"
+			app:layout_constraintTop_toTopOf="parent"
+			app:layout_constraintVertical_chainStyle="spread"
+			app:srcCompat="@drawable/ic_transfer_data"
+			tools:ignore="ContentDescription" />

-	<Button
-		android:id="@+id/sendButton"
-		style="@style/BriarButton"
-		android:layout_width="0dp"
-		android:layout_height="wrap_content"
-		android:layout_margin="16dp"
-		android:text="@string/removable_drive_title_send"
-		app:layout_constraintBottom_toTopOf="@+id/receiveButton"
-		app:layout_constraintEnd_toEndOf="parent"
-		app:layout_constraintStart_toStartOf="parent" />
+		<TextView
+			android:id="@+id/introView"
+			android:layout_width="0dp"
+			android:layout_height="wrap_content"
+			android:layout_margin="32dp"
+			android:text="@string/removable_drive_intro"
+			android:textSize="16sp"
+			app:layout_constraintBottom_toTopOf="@+id/sendButton"
+			app:layout_constraintEnd_toEndOf="parent"
+			app:layout_constraintStart_toStartOf="parent"
+			app:layout_constraintTop_toBottomOf="@+id/imageView" />

-	<Button
-		android:id="@+id/receiveButton"
-		style="@style/BriarButton"
-		android:layout_width="0dp"
-		android:layout_height="wrap_content"
-		android:layout_margin="16dp"
-		android:text="@string/removable_drive_title_receive"
-		app:layout_constraintBottom_toBottomOf="parent"
-		app:layout_constraintEnd_toEndOf="parent"
-		app:layout_constraintStart_toStartOf="parent" />
+		<Button
+			android:id="@+id/sendButton"
+			style="@style/BriarButton"
+			android:layout_width="0dp"
+			android:layout_height="wrap_content"
+			android:layout_margin="16dp"
+			android:text="@string/removable_drive_title_send"
+			app:layout_constraintBottom_toTopOf="@+id/receiveButton"
+			app:layout_constraintEnd_toEndOf="parent"
+			app:layout_constraintStart_toStartOf="parent" />

-</androidx.constraintlayout.widget.ConstraintLayout>
+		<Button
+			android:id="@+id/receiveButton"
+			style="@style/BriarButton"
+			android:layout_width="0dp"
+			android:layout_height="wrap_content"
+			android:layout_margin="16dp"
+			android:text="@string/removable_drive_title_receive"
+			app:layout_constraintBottom_toBottomOf="parent"
+			app:layout_constraintEnd_toEndOf="parent"
+			app:layout_constraintStart_toStartOf="parent" />
+
+	</androidx.constraintlayout.widget.ConstraintLayout>
+
+</ScrollView>
--- a/briar-android/src/main/res/layout/fragment_transfer_data_receive.xml
+++ b/briar-android/src/main/res/layout/fragment_transfer_data_receive.xml
@@ -1,102 +1,72 @@
 <?xml version="1.0" encoding="utf-8"?>
-<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
 	xmlns:app="http://schemas.android.com/apk/res-auto"
 	xmlns:tools="http://schemas.android.com/tools"
 	android:layout_width="match_parent"
-	android:layout_height="match_parent">
+	android:layout_height="match_parent"
+	android:fillViewport="true">

-	<androidx.constraintlayout.widget.Guideline
-		android:id="@+id/guideline"
-		android:layout_width="wrap_content"
-		android:layout_height="wrap_content"
-		android:orientation="vertical"
-		app:layout_constraintGuide_percent="0.5" />
+	<androidx.constraintlayout.widget.ConstraintLayout
+		android:layout_width="match_parent"
+		android:layout_height="wrap_content">

-	<ImageView
-		android:id="@+id/driveImageView"
-		android:layout_width="0dp"
-		android:layout_height="0dp"
-		android:layout_marginStart="32dp"
-		android:layout_marginLeft="32dp"
-		android:padding="24dp"
-		app:layout_constraintBottom_toBottomOf="@+id/phoneImageView"
-		app:layout_constraintDimensionRatio="1:1"
-		app:layout_constraintEnd_toStartOf="@+id/arrowImageView"
-		app:layout_constraintStart_toStartOf="parent"
-		app:layout_constraintTop_toTopOf="@+id/phoneImageView"
-		app:layout_constraintWidth_max="150dp"
-		app:srcCompat="@drawable/ic_flash_drive"
-		tools:ignore="ContentDescription" />
+		<ImageView
+			android:id="@+id/imageView"
+			android:layout_width="0dp"
+			android:layout_height="0dp"
+			android:layout_marginStart="32dp"
+			android:layout_marginTop="32dp"
+			android:layout_marginEnd="32dp"
+			app:layout_constraintWidth_max="300dp"
+			app:layout_constraintBottom_toTopOf="@+id/progressBar"
+			app:layout_constraintDimensionRatio="1,2"
+			app:layout_constraintEnd_toEndOf="parent"
+			app:layout_constraintStart_toStartOf="parent"
+			app:layout_constraintTop_toTopOf="parent"
+			app:layout_constraintVertical_chainStyle="spread"
+			app:srcCompat="@drawable/ic_transfer_data_send"
+			tools:ignore="ContentDescription" />

-	<ImageView
-		android:id="@+id/arrowImageView"
-		android:layout_width="0dp"
-		android:layout_height="0dp"
-		app:layout_constraintBottom_toBottomOf="@+id/driveImageView"
-		app:layout_constraintDimensionRatio="1:1"
-		app:layout_constraintEnd_toStartOf="@+id/guideline"
-		app:layout_constraintStart_toStartOf="@+id/guideline"
-		app:layout_constraintTop_toTopOf="@+id/driveImageView"
-		app:layout_constraintWidth_max="64dp"
-		app:srcCompat="@drawable/ic_arrow_forward"
-		app:tint="@color/briar_brand_green"
-		tools:ignore="ContentDescription" />
+		<ProgressBar
+			android:id="@+id/progressBar"
+			style="?android:attr/progressBarStyleHorizontal"
+			android:layout_width="0dp"
+			android:layout_height="wrap_content"
+			android:layout_margin="32dp"
+			android:indeterminate="true"
+			android:visibility="invisible"
+			app:layout_constraintBottom_toTopOf="@+id/introTextView"
+			app:layout_constraintEnd_toEndOf="parent"
+			app:layout_constraintStart_toStartOf="parent"
+			app:layout_constraintTop_toBottomOf="@+id/imageView"
+			tools:visibility="visible" />

-	<ProgressBar
-		android:id="@+id/progressBar"
-		style="?android:attr/progressBarStyleHorizontal"
-		android:layout_width="0dp"
-		android:layout_height="wrap_content"
-		android:layout_margin="32dp"
-		android:indeterminate="true"
-		android:visibility="invisible"
-		app:layout_constraintBottom_toTopOf="@+id/introTextView"
-		app:layout_constraintEnd_toEndOf="parent"
-		app:layout_constraintStart_toStartOf="parent"
-		app:layout_constraintTop_toBottomOf="@+id/phoneImageView"
-		tools:visibility="visible" />
+		<TextView
+			android:id="@+id/introTextView"
+			android:layout_width="0dp"
+			android:layout_height="wrap_content"
+			android:layout_marginStart="32dp"
+			android:layout_marginEnd="32dp"
+			android:layout_marginBottom="16dp"
+			android:text="@string/removable_drive_receive_intro"
+			android:textSize="16sp"
+			app:layout_constraintBottom_toTopOf="@+id/fileButton"
+			app:layout_constraintEnd_toEndOf="parent"
+			app:layout_constraintStart_toStartOf="parent"
+			app:layout_constraintTop_toBottomOf="@+id/progressBar" />

-	<ImageView
-		android:id="@+id/phoneImageView"
-		android:layout_width="0dp"
-		android:layout_height="0dp"
-		android:layout_marginTop="32dp"
-		android:layout_marginEnd="32dp"
-		android:layout_marginRight="32dp"
-		app:layout_constraintBottom_toTopOf="@+id/progressBar"
-		app:layout_constraintDimensionRatio="1:1"
-		app:layout_constraintEnd_toEndOf="parent"
-		app:layout_constraintStart_toEndOf="@+id/arrowImageView"
-		app:layout_constraintTop_toTopOf="parent"
-		app:layout_constraintVertical_chainStyle="spread"
-		app:layout_constraintWidth_max="150dp"
-		app:srcCompat="@drawable/ic_phone_android"
-		tools:ignore="ContentDescription" />
+		<Button
+			android:id="@+id/fileButton"
+			style="@style/BriarButton"
+			android:layout_width="0dp"
+			android:layout_height="wrap_content"
+			android:layout_margin="16dp"
+			android:enabled="false"
+			android:text="@string/removable_drive_receive_button"
+			app:layout_constraintBottom_toBottomOf="parent"
+			app:layout_constraintEnd_toEndOf="parent"
+			app:layout_constraintStart_toStartOf="parent" />

-	<TextView
-		android:id="@+id/introTextView"
-		android:layout_width="0dp"
-		android:layout_height="wrap_content"
-		android:layout_marginStart="32dp"
-		android:layout_marginEnd="32dp"
-		android:layout_marginBottom="8dp"
-		android:text="@string/removable_drive_receive_intro"
-		android:textSize="16sp"
-		app:layout_constraintBottom_toTopOf="@+id/fileButton"
-		app:layout_constraintEnd_toEndOf="parent"
-		app:layout_constraintStart_toStartOf="parent"
-		app:layout_constraintTop_toBottomOf="@+id/progressBar" />
+	</androidx.constraintlayout.widget.ConstraintLayout>

-	<Button
-		android:id="@+id/fileButton"
-		style="@style/BriarButton"
-		android:layout_width="0dp"
-		android:layout_height="wrap_content"
-		android:layout_margin="16dp"
-		android:enabled="false"
-		android:text="@string/removable_drive_receive_button"
-		app:layout_constraintBottom_toBottomOf="parent"
-		app:layout_constraintEnd_toEndOf="parent"
-		app:layout_constraintStart_toStartOf="parent" />
-
-</androidx.constraintlayout.widget.ConstraintLayout>
+</ScrollView>
--- a/briar-android/src/main/res/layout/fragment_transfer_data_send.xml
+++ b/briar-android/src/main/res/layout/fragment_transfer_data_send.xml
@@ -1,103 +1,71 @@
 <?xml version="1.0" encoding="utf-8"?>
-<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
 	xmlns:app="http://schemas.android.com/apk/res-auto"
 	xmlns:tools="http://schemas.android.com/tools"
 	android:layout_width="match_parent"
-	android:layout_height="match_parent">
+	android:layout_height="match_parent"
+	android:fillViewport="true">

-	<androidx.constraintlayout.widget.Guideline
-		android:id="@+id/guideline"
-		android:layout_width="wrap_content"
-		android:layout_height="wrap_content"
-		android:orientation="vertical"
-		app:layout_constraintGuide_percent="0.5" />
+	<androidx.constraintlayout.widget.ConstraintLayout
+		android:layout_width="match_parent"
+		android:layout_height="wrap_content">

-	<ImageView
-		android:id="@+id/phoneImageView"
-		android:layout_width="0dp"
-		android:layout_height="0dp"
-		android:layout_marginStart="32dp"
-		android:layout_marginLeft="32dp"
-		android:layout_marginTop="32dp"
-		app:layout_constraintBottom_toTopOf="@+id/progressBar"
-		app:layout_constraintDimensionRatio="1:1"
-		app:layout_constraintEnd_toStartOf="@+id/arrowImageView"
-		app:layout_constraintStart_toStartOf="parent"
-		app:layout_constraintTop_toTopOf="parent"
-		app:layout_constraintVertical_chainStyle="spread"
-		app:layout_constraintWidth_max="150dp"
-		app:srcCompat="@drawable/ic_phone_android"
-		tools:ignore="ContentDescription" />
+		<ImageView
+			android:id="@+id/imageView"
+			android:layout_width="0dp"
+			android:layout_height="0dp"
+			android:layout_marginStart="32dp"
+			android:layout_marginTop="32dp"
+			android:layout_marginEnd="32dp"
+			app:layout_constraintBottom_toTopOf="@+id/progressBar"
+			app:layout_constraintDimensionRatio="1,2"
+			app:layout_constraintEnd_toEndOf="parent"
+			app:layout_constraintStart_toStartOf="parent"
+			app:layout_constraintTop_toTopOf="parent"
+			app:layout_constraintVertical_chainStyle="spread"
+			app:layout_constraintWidth_max="300dp"
+			app:srcCompat="@drawable/ic_transfer_data_send"
+			tools:ignore="ContentDescription" />

-	<ImageView
-		android:id="@+id/arrowImageView"
-		android:layout_width="0dp"
-		android:layout_height="0dp"
-		android:layout_marginStart="16dp"
-		android:layout_marginEnd="16dp"
-		app:layout_constraintBottom_toBottomOf="@+id/phoneImageView"
-		app:layout_constraintDimensionRatio="1:1"
-		app:layout_constraintEnd_toStartOf="@+id/guideline"
-		app:layout_constraintStart_toStartOf="@+id/guideline"
-		app:layout_constraintTop_toTopOf="@+id/phoneImageView"
-		app:layout_constraintWidth_max="64dp"
-		app:srcCompat="@drawable/ic_arrow_forward"
-		app:tint="@color/briar_brand_green"
-		tools:ignore="ContentDescription" />
+		<ProgressBar
+			android:id="@+id/progressBar"
+			style="?android:attr/progressBarStyleHorizontal"
+			android:layout_width="0dp"
+			android:layout_height="wrap_content"
+			android:layout_margin="32dp"
+			android:visibility="invisible"
+			app:layout_constraintBottom_toTopOf="@+id/introTextView"
+			app:layout_constraintEnd_toEndOf="parent"
+			app:layout_constraintStart_toStartOf="parent"
+			app:layout_constraintTop_toBottomOf="@+id/imageView"
+			tools:visibility="visible" />

-	<ImageView
-		android:id="@+id/driveImageView"
-		android:layout_width="0dp"
-		android:layout_height="0dp"
-		android:layout_marginEnd="32dp"
-		android:layout_marginRight="32dp"
-		android:padding="24dp"
-		app:layout_constraintBottom_toBottomOf="@+id/phoneImageView"
-		app:layout_constraintDimensionRatio="1:1"
-		app:layout_constraintEnd_toEndOf="parent"
-		app:layout_constraintStart_toEndOf="@+id/arrowImageView"
-		app:layout_constraintTop_toTopOf="@+id/phoneImageView"
-		app:layout_constraintWidth_max="150dp"
-		app:srcCompat="@drawable/ic_flash_drive"
-		tools:ignore="ContentDescription" />
+		<TextView
+			android:id="@+id/introTextView"
+			android:layout_width="0dp"
+			android:layout_height="wrap_content"
+			android:layout_marginStart="32dp"
+			android:layout_marginEnd="32dp"
+			android:layout_marginBottom="16dp"
+			android:text="@string/removable_drive_send_intro"
+			android:textSize="16sp"
+			app:layout_constraintBottom_toTopOf="@+id/fileButton"
+			app:layout_constraintEnd_toEndOf="parent"
+			app:layout_constraintStart_toStartOf="parent"
+			app:layout_constraintTop_toBottomOf="@+id/progressBar" />

-	<ProgressBar
-		android:id="@+id/progressBar"
-		style="?android:attr/progressBarStyleHorizontal"
-		android:layout_width="0dp"
-		android:layout_height="wrap_content"
-		android:layout_margin="32dp"
-		android:visibility="invisible"
-		app:layout_constraintBottom_toTopOf="@+id/introTextView"
-		app:layout_constraintEnd_toEndOf="parent"
-		app:layout_constraintStart_toStartOf="parent"
-		app:layout_constraintTop_toBottomOf="@+id/phoneImageView"
-		tools:visibility="visible" />
+		<Button
+			android:id="@+id/fileButton"
+			style="@style/BriarButton"
+			android:layout_width="0dp"
+			android:layout_height="wrap_content"
+			android:layout_margin="16dp"
+			android:enabled="false"
+			android:text="@string/removable_drive_send_button"
+			app:layout_constraintBottom_toBottomOf="parent"
+			app:layout_constraintEnd_toEndOf="parent"
+			app:layout_constraintStart_toStartOf="parent" />

-	<TextView
-		android:id="@+id/introTextView"
-		android:layout_width="0dp"
-		android:layout_height="wrap_content"
-		android:layout_marginStart="32dp"
-		android:layout_marginEnd="32dp"
-		android:layout_marginBottom="8dp"
-		android:text="@string/removable_drive_send_intro"
-		android:textSize="16sp"
-		app:layout_constraintBottom_toTopOf="@+id/fileButton"
-		app:layout_constraintEnd_toEndOf="parent"
-		app:layout_constraintStart_toStartOf="parent"
-		app:layout_constraintTop_toBottomOf="@+id/progressBar" />
+	</androidx.constraintlayout.widget.ConstraintLayout>

-	<Button
-		android:id="@+id/fileButton"
-		style="@style/BriarButton"
-		android:layout_width="0dp"
-		android:layout_height="wrap_content"
-		android:layout_margin="16dp"
-		android:enabled="false"
-		android:text="@string/removable_drive_send_button"
-		app:layout_constraintBottom_toBottomOf="parent"
-		app:layout_constraintEnd_toEndOf="parent"
-		app:layout_constraintStart_toStartOf="parent" />
-
-</androidx.constraintlayout.widget.ConstraintLayout>
+</ScrollView>