Skip to content

Commit 66fd741

Browse files
pimterrypimterry
committed
Improve layout on smaller screens
1 parent 7e5d271 commit 66fd741

File tree

2 files changed

+116
-26
lines changed

2 files changed

+116
-26
lines changed

‎app/src/main/res/layout-h700dp/main_layout.xml‎

Lines changed: 82 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,82 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
3+
xmlns:app="http://schemas.android.com/apk/res-auto"
4+
xmlns:tools="http://schemas.android.com/tools"
5+
android:layout_width="match_parent"
6+
android:layout_height="match_parent"
7+
tools:context=".MainActivity">
8+
9+
<androidx.constraintlayout.widget.Guideline
10+
android:id="@+id/logoGuideline"
11+
android:layout_width="wrap_content"
12+
android:layout_height="wrap_content"
13+
android:orientation="horizontal"
14+
app:layout_constraintGuide_percent="0.175" />
15+
16+
<ImageView
17+
android:id="@+id/logoImage"
18+
android:layout_width="wrap_content"
19+
android:layout_height="wrap_content"
20+
android:contentDescription="The HTTP Toolkit Logo"
21+
app:layout_constraintBottom_toBottomOf="@+id/logoGuideline"
22+
app:layout_constraintTop_toTopOf="@+id/logoGuideline"
23+
app:layout_constraintEnd_toEndOf="parent"
24+
app:layout_constraintStart_toStartOf="parent"
25+
app:srcCompat="@drawable/ic_transparent_icon" />
26+
27+
<androidx.constraintlayout.widget.Guideline
28+
android:id="@+id/statusGuideline"
29+
android:layout_width="wrap_content"
30+
android:layout_height="wrap_content"
31+
android:orientation="horizontal"
32+
app:layout_constraintGuide_percent="0.35" />
33+
34+
<TextView
35+
android:id="@+id/statusText"
36+
style="@style/StatusText"
37+
android:layout_width="wrap_content"
38+
android:layout_height="wrap_content"
39+
android:layout_marginStart="8dp"
40+
android:layout_marginEnd="8dp"
41+
android:text="Not Connected"
42+
app:layout_constraintBottom_toBottomOf="@+id/statusGuideline"
43+
app:layout_constraintTop_toTopOf="@+id/statusGuideline"
44+
app:layout_constraintEnd_toEndOf="parent"
45+
app:layout_constraintStart_toStartOf="parent" />
46+
47+
<LinearLayout
48+
android:id="@+id/statusDetailContainer"
49+
android:layout_width="wrap_content"
50+
android:layout_height="wrap_content"
51+
android:layout_marginStart="16dp"
52+
android:layout_marginEnd="16dp"
53+
app:layout_constrainedWidth="true"
54+
app:layout_constraintEnd_toEndOf="parent"
55+
app:layout_constraintStart_toStartOf="parent"
56+
app:layout_constraintTop_toBottomOf="@+id/statusText"
57+
android:orientation="vertical" />
58+
59+
<com.google.android.material.card.MaterialCardView
60+
android:layout_height="wrap_content"
61+
android:layout_width="match_parent"
62+
android:layout_marginStart="16dp"
63+
android:layout_marginEnd="16dp"
64+
app:layout_constraintBottom_toBottomOf="parent"
65+
app:layout_constraintEnd_toEndOf="parent"
66+
app:layout_constraintStart_toStartOf="parent"
67+
style="@style/PortraitButtonsCard"
68+
>
69+
<LinearLayout
70+
android:id="@+id/buttonLayoutContainer"
71+
android:layout_width="match_parent"
72+
android:layout_height="wrap_content"
73+
android:orientation="vertical"
74+
android:paddingStart="16dp"
75+
android:paddingEnd="16dp"
76+
android:paddingTop="12dp"
77+
android:paddingBottom="10dp"
78+
android:clipToPadding="false">
79+
</LinearLayout>
80+
</com.google.android.material.card.MaterialCardView>
81+
82+
</androidx.constraintlayout.widget.ConstraintLayout>

‎app/src/main/res/layout/main_layout.xml‎

Lines changed: 34 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -11,38 +11,46 @@
1111
android:layout_width="wrap_content"
1212
android:layout_height="wrap_content"
1313
android:orientation="horizontal"
14-
app:layout_constraintGuide_percent="0.15" />
14+
app:layout_constraintGuide_percent="0.16" />
1515

16-
<ImageView
17-
android:id="@+id/logoImage"
18-
android:layout_width="wrap_content"
16+
<LinearLayout
17+
android:id="@+id/headingContainer"
18+
android:layout_width="match_parent"
1919
android:layout_height="wrap_content"
20-
android:contentDescription="The HTTP Toolkit Logo"
20+
android:paddingBottom="20dp"
2121
app:layout_constraintBottom_toBottomOf="@+id/logoGuideline"
2222
app:layout_constraintTop_toTopOf="@+id/logoGuideline"
23-
app:layout_constraintEnd_toEndOf="parent"
2423
app:layout_constraintStart_toStartOf="parent"
25-
app:srcCompat="@drawable/ic_transparent_icon" />
24+
app:layout_constraintEnd_toEndOf="parent">
2625

27-
<androidx.constraintlayout.widget.Guideline
28-
android:id="@+id/statusGuideline"
29-
android:layout_width="wrap_content"
30-
android:layout_height="wrap_content"
31-
android:orientation="horizontal"
32-
app:layout_constraintGuide_percent="0.3" />
26+
<ImageView
27+
android:id="@+id/logoImage"
28+
android:layout_width="wrap_content"
29+
android:layout_height="wrap_content"
30+
android:paddingStart="16dp"
31+
android:contentDescription="The HTTP Toolkit Logo"
32+
app:srcCompat="@drawable/ic_transparent_icon" />
3333

34-
<TextView
35-
android:id="@+id/statusText"
36-
style="@style/StatusText"
37-
android:layout_width="wrap_content"
38-
android:layout_height="wrap_content"
39-
android:layout_marginStart="8dp"
40-
android:layout_marginEnd="8dp"
41-
android:text="Not Connected"
42-
app:layout_constraintBottom_toBottomOf="@+id/statusGuideline"
43-
app:layout_constraintTop_toTopOf="@+id/statusGuideline"
44-
app:layout_constraintEnd_toEndOf="parent"
45-
app:layout_constraintStart_toStartOf="parent" />
34+
<View
35+
android:layout_width="0dp"
36+
android:layout_height="0dp"
37+
android:layout_weight="1" />
38+
39+
<TextView
40+
android:id="@+id/statusText"
41+
style="@style/StatusText"
42+
android:layout_width="wrap_content"
43+
android:layout_height="wrap_content"
44+
android:layout_gravity="center"
45+
android:text="@string/disconnected_status"
46+
android:textSize="30sp" />
47+
48+
<View
49+
android:layout_width="0dp"
50+
android:layout_height="0dp"
51+
android:layout_weight="1" />
52+
53+
</LinearLayout>
4654

4755
<LinearLayout
4856
android:id="@+id/statusDetailContainer"
@@ -53,7 +61,7 @@
5361
app:layout_constrainedWidth="true"
5462
app:layout_constraintEnd_toEndOf="parent"
5563
app:layout_constraintStart_toStartOf="parent"
56-
app:layout_constraintTop_toBottomOf="@+id/statusText"
64+
app:layout_constraintTop_toBottomOf="@+id/headingContainer"
5765
android:orientation="vertical" />
5866

5967
<com.google.android.material.card.MaterialCardView

0 commit comments

Comments
 (0)