Skip to content
This repository was archived by the owner on Aug 22, 2024. It is now read-only.

Commit 986ccc2

Browse files
hossain-khanhossain-khan
authored
Merge pull request #83 from amardeshbd/54-dimension-min-max
[ADDED] [#54] Simple min max width & height example.
2 parents 39356f1 + c2c4158 commit 986ccc2

13 files changed

+227
-8
lines changed

‎README.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@ See https://github.com/googlesamples/android-ConstraintLayoutExamples
3535
- [ ] Dimension constraints
3636
* [x] Ratio
3737
* [x] Percent dimension
38-
* [ ] Min and Max
38+
* [x] Min and Max
3939
* [ ] `MATCH_CONSTRAINT` dimensions _(Added in 1.1)_
4040
* [ ] `WRAP_CONTENT` : enforcing constraints _(Added in 1.1)_
4141
* [ ] Widgets dimension constraints

‎app/src/main/AndroidManifest.xml

+3
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,9 @@
3434
<activity
3535
android:name="com.hossainkhan.android.demo.ui.layoutpreview.LayoutGuidelineGroupActivity"
3636
android:parentActivityName="com.hossainkhan.android.demo.ui.browse.LayoutBrowseActivity" />
37+
<activity
38+
android:name="com.hossainkhan.android.demo.ui.layoutpreview.LayoutDimensionMinMaxActivity"
39+
android:parentActivityName="com.hossainkhan.android.demo.ui.browse.LayoutBrowseActivity" />
3740
</application>
3841

3942
</manifest>

‎app/src/main/java/com/hossainkhan/android/demo/data/LayoutDataStore.kt

+13
Original file line numberDiff line numberDiff line change
@@ -111,13 +111,26 @@ class LayoutDataStore @Inject constructor(
111111
"The ratio can be expressed either as:\n" +
112112
"\n * a float value, representing a ratio between width and height" +
113113
"\n * a ratio in the form \"width:height\", for example: `layout_constraintDimensionRatio=\"16:9\"`"),
114+
115+
/*
116+
* https://developer.android.com/reference/android/support/constraint/ConstraintLayout#DimensionConstraints
117+
*/
118+
LayoutInformation(
119+
layoutResourceId = R.layout.preview_dimension_min_max,
120+
thumbnailResourceId = R.drawable.thumb_dimension_min_max,
121+
title = "Dimension: Min & Max (width/height)",
122+
description = "You can define minimum and maximum sizes for the ConstraintLayout itself:\n\n" +
123+
"* Standard attributes can should be use - `minWidth`, `minHeight`, `maxWidth`, `maxHeight`.\n" +
124+
"* Those minimum and maximum dimensions will be used by ConstraintLayout when its dimensions are set to `WRAP_CONTENT`"),
125+
114126
LayoutInformation(
115127
layoutResourceId = R.layout.preview_dimension_percent,
116128
thumbnailResourceId = R.drawable.thumb_dimension_percentage,
117129
title = "Dimension: Percent dimension",
118130
description = "To use percent, you need to set the following:\n\n" +
119131
"* The dimension should be set to MATCH_CONSTRAINT (0dp)\n" +
120132
"* Then set the `layout_constraintWidth_percent` or `layout_constraintHeight_percent` attributes to a value between 0.0 and 1.0"),
133+
121134
LayoutInformation(
122135
layoutResourceId = R.layout.preview_virtual_helper_guideline,
123136
thumbnailResourceId = R.drawable.thumb_virtual_helper_guideline,

‎app/src/main/java/com/hossainkhan/android/demo/di/ActivityBindingModule.kt

+5
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@
1717
package com.hossainkhan.android.demo.di
1818

1919
import com.hossainkhan.android.demo.ui.layoutpreview.LayoutChainStyleActivity
20+
import com.hossainkhan.android.demo.ui.layoutpreview.LayoutDimensionMinMaxActivity
2021
import com.hossainkhan.android.demo.ui.layoutpreview.LayoutGuidelineBarrierActivity
2122
import com.hossainkhan.android.demo.ui.layoutpreview.LayoutGuidelineGroupActivity
2223
import com.hossainkhan.android.demo.ui.layoutpreview.LayoutPreviewBaseActivity
@@ -68,4 +69,8 @@ abstract class ActivityBindingModule {
6869
@ActivityScope
6970
@ContributesAndroidInjector
7071
abstract fun layoutGuidelineGroupActivity(): LayoutGuidelineGroupActivity
72+
73+
@ActivityScope
74+
@ContributesAndroidInjector
75+
abstract fun layoutDimensionMinMaxActivity(): LayoutDimensionMinMaxActivity
7176
}

‎app/src/main/java/com/hossainkhan/android/demo/ui/browse/LayoutBrowseViewModel.kt

+4
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ import com.hossainkhan.android.demo.R
2323
import com.hossainkhan.android.demo.data.AppDataStore
2424
import com.hossainkhan.android.demo.data.LayoutInformation
2525
import com.hossainkhan.android.demo.ui.layoutpreview.LayoutChainStyleActivity
26+
import com.hossainkhan.android.demo.ui.layoutpreview.LayoutDimensionMinMaxActivity
2627
import com.hossainkhan.android.demo.ui.layoutpreview.LayoutGuidelineBarrierActivity
2728
import com.hossainkhan.android.demo.ui.layoutpreview.LayoutGuidelineGroupActivity
2829
import com.hossainkhan.android.demo.ui.layoutpreview.LayoutVisibilityGoneActivity
@@ -65,6 +66,9 @@ class LayoutBrowseViewModel(
6566
R.layout.preview_virtual_helper_group -> {
6667
browseNavigator.loadLayoutPreview(LayoutGuidelineGroupActivity::class.java, layoutResId)
6768
}
69+
R.layout.preview_dimension_min_max -> {
70+
browseNavigator.loadLayoutPreview(LayoutDimensionMinMaxActivity::class.java, layoutResId)
71+
}
6872
else -> {
6973
// By default it loads the preview activity with the layout requested.
7074
browseNavigator.loadLayoutPreview(layoutResId)

‎app/src/main/java/com/hossainkhan/android/demo/ui/layoutpreview/LayoutDimensionMinMaxActivity.kt

+46
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
/*
2+
* Copyright (c) 2019 Hossain Khan
3+
*
4+
* Licensed under the Apache License, Version 2.0 (the "License");
5+
* you may not use this file except in compliance with the License.
6+
* You may obtain a copy of the License at
7+
*
8+
* http://www.apache.org/licenses/LICENSE-2.0
9+
*
10+
* Unless required by applicable law or agreed to in writing, software
11+
* distributed under the License is distributed on an "AS IS" BASIS,
12+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
* See the License for the specific language governing permissions and
14+
* limitations under the License.
15+
*/
16+
17+
package com.hossainkhan.android.demo.ui.layoutpreview
18+
19+
import android.os.Bundle
20+
import android.widget.Button
21+
import android.widget.TextView
22+
import com.hossainkhan.android.demo.R
23+
24+
/**
25+
* Activity showcasing how virtual guideline group containing multiple views and how it can be changed.
26+
*
27+
* See https://developer.android.com/reference/android/support/constraint/Barrier
28+
*/
29+
class LayoutDimensionMinMaxActivity : LayoutPreviewBaseActivity() {
30+
31+
override fun onCreate(savedInstanceState: Bundle?) {
32+
super.onCreate(savedInstanceState)
33+
34+
// Setup additional view that is only available in this screen.
35+
val toggleButton = findViewById<Button>(R.id.toggle_container_text)
36+
val textLabel = findViewById<TextView>(R.id.text_view_with_min_max)
37+
38+
toggleButton.setOnClickListener {
39+
if (textLabel.text == getString(R.string.label_text_small)) {
40+
textLabel.setText(R.string.lorem_ipsum)
41+
} else {
42+
textLabel.setText(R.string.label_text_small)
43+
}
44+
}
45+
}
46+
}

‎app/src/main/java/com/hossainkhan/android/demo/ui/layoutpreview/LayoutGuidelineBarrierActivity.kt

+3-3
Original file line numberDiff line numberDiff line change
@@ -36,10 +36,10 @@ class LayoutGuidelineBarrierActivity : LayoutPreviewBaseActivity() {
3636
val textLabel = findViewById<TextView>(R.id.text_label)
3737

3838
toggleButton.setOnClickListener {
39-
if (textLabel.text == getString(R.string.barrier_label_text_small)) {
40-
textLabel.setText(R.string.barrier_label_text_long)
39+
if (textLabel.text == getString(R.string.label_text_small)) {
40+
textLabel.setText(R.string.label_text_long)
4141
} else {
42-
textLabel.setText(R.string.barrier_label_text_small)
42+
textLabel.setText(R.string.label_text_small)
4343
}
4444
}
4545
}

‎app/src/main/res/drawable/thumb_dimension_min_max.xml

+70
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
<!--
2+
~ Copyright (c) 2019 Hossain Khan
3+
~
4+
~ Licensed under the Apache License, Version 2.0 (the "License");
5+
~ you may not use this file except in compliance with the License.
6+
~ You may obtain a copy of the License at
7+
~
8+
~ http://www.apache.org/licenses/LICENSE-2.0
9+
~
10+
~ Unless required by applicable law or agreed to in writing, software
11+
~ distributed under the License is distributed on an "AS IS" BASIS,
12+
~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
~ See the License for the specific language governing permissions and
14+
~ limitations under the License.
15+
-->
16+
17+
<vector android:alpha="0.9" android:height="640dp"
18+
android:viewportHeight="640" android:viewportWidth="640"
19+
android:width="640dp" xmlns:android="http://schemas.android.com/apk/res/android">
20+
<path android:fillAlpha="0" android:fillColor="#000000" android:pathData="M2.46,637.84L637.54,637.84L637.54,2.16L2.46,2.16L2.46,637.84Z"/>
21+
<path android:fillAlpha="0" android:fillColor="#FF000000"
22+
android:pathData="M2.46,637.84L637.54,637.84L637.54,2.16L2.46,2.16L2.46,637.84Z"
23+
android:strokeAlpha="1" android:strokeColor="#000000" android:strokeWidth="2"/>
24+
<path android:fillAlpha="1" android:fillColor="#4fc3f7" android:pathData="M305.19,250C307.84,250 310,252.16 310,254.81C310,273.58 310,325.06 310,343.82C310,346.48 307.84,348.64 305.19,348.64C256.15,348.64 113.85,348.64 64.81,348.64C62.16,348.64 60,346.48 60,343.82C60,325.06 60,273.58 60,254.81C60,252.16 62.16,250 64.81,250C113.85,250 256.15,250 305.19,250Z"/>
25+
<path android:fillAlpha="0" android:fillColor="#FF000000"
26+
android:pathData="M50,230L410,230L410,370L50,370L50,230Z"
27+
android:strokeAlpha="1" android:strokeColor="#2cc893" android:strokeWidth="3"/>
28+
<path android:fillAlpha="0" android:fillColor="#FF000000"
29+
android:pathData="M40,221.36L606.18,221.36L606.18,378.64L40,378.64L40,221.36Z"
30+
android:strokeAlpha="1" android:strokeColor="#2cc893" android:strokeWidth="3"/>
31+
<path android:fillAlpha="0" android:fillColor="#FF000000"
32+
android:pathData="M391.73,330L400,340L320,340"
33+
android:strokeAlpha="1" android:strokeColor="#000000" android:strokeWidth="2"/>
34+
<path android:fillAlpha="0" android:fillColor="#FF000000"
35+
android:pathData="M391.73,350L400,340L320,340"
36+
android:strokeAlpha="1" android:strokeColor="#000000" android:strokeWidth="2"/>
37+
<path android:fillAlpha="0" android:fillColor="#FF000000"
38+
android:pathData="M328.27,330L320,340L400,340"
39+
android:strokeAlpha="1" android:strokeColor="#000000" android:strokeWidth="2"/>
40+
<path android:fillAlpha="0" android:fillColor="#FF000000"
41+
android:pathData="M328.27,350L320,340L400,340"
42+
android:strokeAlpha="1" android:strokeColor="#000000" android:strokeWidth="2"/>
43+
<path android:fillAlpha="0" android:fillColor="#FF000000"
44+
android:pathData="M572.42,330L590,340L420,340"
45+
android:strokeAlpha="1" android:strokeColor="#000000" android:strokeWidth="2"/>
46+
<path android:fillAlpha="0" android:fillColor="#FF000000"
47+
android:pathData="M572.42,350L590,340L420,340"
48+
android:strokeAlpha="1" android:strokeColor="#000000" android:strokeWidth="2"/>
49+
<path android:fillAlpha="0" android:fillColor="#FF000000"
50+
android:pathData="M433.44,330L420,340L550,340"
51+
android:strokeAlpha="1" android:strokeColor="#000000" android:strokeWidth="2"/>
52+
<path android:fillAlpha="0" android:fillColor="#FF000000"
53+
android:pathData="M433.44,350L420,340L550,340"
54+
android:strokeAlpha="1" android:strokeColor="#000000" android:strokeWidth="2"/>
55+
<path android:fillAlpha="0" android:fillColor="#FF000000"
56+
android:pathData="M470,318.54L470,269.74L450,288.54L430,269.74L430,320"
57+
android:strokeAlpha="1" android:strokeColor="#14503c" android:strokeWidth="5"/>
58+
<path android:fillAlpha="0" android:fillColor="#FF000000"
59+
android:pathData="M530,318.54L522.03,298.62L510,268.54L498.28,297.85L490,318.54"
60+
android:strokeAlpha="1" android:strokeColor="#14503c" android:strokeWidth="5"/>
61+
<path android:fillAlpha="0" android:fillColor="#FF000000"
62+
android:pathData="M521.47,298.54L497.91,298.54"
63+
android:strokeAlpha="1" android:strokeColor="#14503c" android:strokeWidth="5"/>
64+
<path android:fillAlpha="0" android:fillColor="#FF000000"
65+
android:pathData="M590,268.54L550,318.54"
66+
android:strokeAlpha="1" android:strokeColor="#14503c" android:strokeWidth="5"/>
67+
<path android:fillAlpha="0" android:fillColor="#FF000000"
68+
android:pathData="M590,318.54L550,268.54"
69+
android:strokeAlpha="1" android:strokeColor="#14503c" android:strokeWidth="5"/>
70+
</vector>

‎app/src/main/res/layout/.README.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ Each layout must also be named based on sub features. Use following convention t
2020
- Prefix: **`_dimension_`** | Dimension constraints
2121
* Prefix: **`_ratio_`** | Ratio
2222
* Prefix: **`_percent_`** | Percent dimension
23-
* Prefix: **`_sizing_`** | Min and Max
23+
* Prefix: **`_min_max_`** | Min and Max
2424
* Prefix: **`_TBD_`** | `MATCH_CONSTRAINT` dimensions _(Added in 1.1)_
2525
* Prefix: **`_TBD_`** | `WRAP_CONTENT` : enforcing constraints _(Added in 1.1)_
2626
* Prefix: **`_TBD_`** | Widgets dimension constraints

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

+75
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
3+
<!--
4+
~ Copyright (c) 2019 Hossain Khan
5+
~
6+
~ Licensed under the Apache License, Version 2.0 (the "License");
7+
~ you may not use this file except in compliance with the License.
8+
~ You may obtain a copy of the License at
9+
~
10+
~ http://www.apache.org/licenses/LICENSE-2.0
11+
~
12+
~ Unless required by applicable law or agreed to in writing, software
13+
~ distributed under the License is distributed on an "AS IS" BASIS,
14+
~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
15+
~ See the License for the specific language governing permissions and
16+
~ limitations under the License.
17+
-->
18+
19+
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
20+
xmlns:app="http://schemas.android.com/apk/res-auto"
21+
xmlns:tools="http://schemas.android.com/tools"
22+
android:layout_width="match_parent"
23+
android:layout_height="match_parent"
24+
tools:context="com.hossainkhan.android.demo.ui.layoutpreview.LayoutPreviewBaseActivity">
25+
26+
27+
<TextView
28+
android:id="@+id/text_view_with_min_max"
29+
style="@style/TextAppearance.AppCompat.Medium"
30+
android:layout_width="wrap_content"
31+
android:layout_height="wrap_content"
32+
android:background="@color/md_pink_200"
33+
android:ellipsize="end"
34+
android:maxWidth="300dp"
35+
android:maxHeight="200dp"
36+
android:minWidth="200dp"
37+
android:minHeight="100dp"
38+
android:padding="8dp"
39+
android:text="@string/label_text_small"
40+
app:layout_constraintBottom_toBottomOf="parent"
41+
app:layout_constraintEnd_toEndOf="parent"
42+
app:layout_constraintStart_toStartOf="parent"
43+
app:layout_constraintTop_toTopOf="parent"
44+
app:layout_constraintVertical_bias="0.30" />
45+
46+
47+
48+
<!-- _________________ IGNORE VIEWS BELOW THIS LINE _________________ -->
49+
50+
<!--
51+
A button to dynamically set label text to showcase the min and max width.
52+
-->
53+
<Button
54+
android:id="@+id/toggle_container_text"
55+
android:layout_width="wrap_content"
56+
android:layout_height="wrap_content"
57+
android:layout_margin="20dp"
58+
android:text="Toggle Text Content"
59+
app:layout_constraintBottom_toBottomOf="parent"
60+
app:layout_constraintEnd_toEndOf="parent"
61+
app:layout_constraintStart_toStartOf="parent"
62+
tools:ignore="HardcodedText" />
63+
64+
<TextView
65+
android:id="@+id/guide_text"
66+
android:layout_width="wrap_content"
67+
android:layout_height="wrap_content"
68+
android:layout_margin="20dp"
69+
android:gravity="center"
70+
android:text="A view with minHeight=100dp, maxHeight=200dp, minWidth=200dp and maxWidth=300dp"
71+
app:layout_constraintEnd_toEndOf="@+id/text_view_with_min_max"
72+
app:layout_constraintStart_toStartOf="@+id/text_view_with_min_max"
73+
app:layout_constraintTop_toBottomOf="@+id/text_view_with_min_max" />
74+
75+
</androidx.constraintlayout.widget.ConstraintLayout>

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

+1-1
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@
3535
android:id="@+id/text_label"
3636
android:layout_width="wrap_content"
3737
android:layout_height="wrap_content"
38-
android:text="@string/barrier_label_text_small"
38+
android:text="@string/label_text_small"
3939
app:layout_constraintEnd_toEndOf="@id/barrier"
4040
app:layout_constraintStart_toStartOf="parent"
4141
app:layout_constraintTop_toTopOf="parent" />

‎app/src/main/res/values/strings.xml

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@
1616

1717
<string name="barrier_guide_text">In this Barrier example, the barrier is set on the right side of "Small Label" and "ACTION LABEL". Notice initially how this description is pushed by the action button. Now, if you toggle the label text, you will see the barrier also grows with it and pushes this content event further.</string>
1818

19-
<string name="barrier_label_text_small">Small Label</string>
20-
<string name="barrier_label_text_long">Much Longer Translated Label</string>
19+
<string name="label_text_small">Small Label</string>
20+
<string name="label_text_long">Much Longer Translated Label</string>
2121

2222
<string name="barrier_label_button_small">Action Label</string>
2323
<string name="barrier_label_button_long">Action Longer Translated Label</string>

0 commit comments

Comments
 (0)