[ADDED] [#47] Weighted items for chains.

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

@@ -86,7 +86,20 @@ class LayoutDataStore @Inject constructor(
                             " * CHAIN_SPREAD -- the elements will be spread out (default style)\n" +
                             " * Weighted chain -- in CHAIN_SPREAD mode, if some widgets are set to MATCH_CONSTRAINT, they will split the available space\n" +
                             " * CHAIN_SPREAD_INSIDE -- similar, but the endpoints of the chain will not be spread out\n" +
-                            " * CHAIN_PACKED -- the elements of the chain will be packed together. The horizontal or vertical bias attribute of the child will then affect the positioning of the packed elements")
+                            " * CHAIN_PACKED -- the elements of the chain will be packed together. The horizontal or vertical bias attribute of the child will then affect the positioning of the packed elements"),
+            LayoutInformation(
+                    layoutResourceId = R.layout.preview_chain_weighted,
+                    thumbnailResourceId = R.drawable.thumb_chain_style,
+                    title = "Chain: Weighted Width or Height",
+                    description = "The default behavior of a chain is to spread the elements equally in the available space. If one or more " +
+                            "elements are using MATCH_CONSTRAINT (0dp), they will use the available empty space (equally divided among " +
+                            "themselves). The attribute `layout_constraintHorizontal_weight` and " +
+                            "`layout_constraintVertical_weight` will control how the space will be distributed among the elements " +
+                            "using MATCH_CONSTRAINT." +
+                            "\n\n" +
+                            "For example, on a chain containing two elements using MATCH_CONSTRAINT, with " +
+                            "the first element using a weight of 2 and the second a weight of 1, the space occupied by the first element" +
+                            "will be twice that of the second element.")
             /*
              Next item template (easy to copy and paste)
              LayoutInformation(

app/src/main/res/layout/preview_chain_weighted.xml

@@ -0,0 +1,80 @@
+<?xml version="1.0" encoding="utf-8"?>
+
+<!--
+  ~ Copyright (c) 2018 Hossain Khan
+  ~
+  ~ Licensed under the Apache License, Version 2.0 (the "License");
+  ~ you may not use this file except in compliance with the License.
+  ~ You may obtain a copy of the License at
+  ~
+  ~     http://www.apache.org/licenses/LICENSE-2.0
+  ~
+  ~ Unless required by applicable law or agreed to in writing, software
+  ~ distributed under the License is distributed on an "AS IS" BASIS,
+  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  ~ See the License for the specific language governing permissions and
+  ~ limitations under the License.
+  -->
+
+<android.support.constraint.ConstraintLayout 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:id="@+id/constraint_layout_root"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent">
+
+    <!--
+        NOTE: All the views width are set to `0dp` to indicate they are
+              `MATCH_CONSTRAINT` horizontally.
+    -->
+
+    <View
+        android:id="@+id/view_chain_view_first"
+        style="@style/MediumBox"
+        android:layout_width="0dp"
+        app:layout_constraintEnd_toStartOf="@+id/view_chain_view_middle"
+        app:layout_constraintHorizontal_weight="10"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toTopOf="parent" />
+
+    <View
+        android:id="@+id/view_chain_view_middle"
+        style="@style/MediumBox.Purple"
+        android:layout_width="0dp"
+
+        app:layout_constraintEnd_toStartOf="@+id/view_chain_view_last"
+        app:layout_constraintHorizontal_weight="60"
+        app:layout_constraintStart_toEndOf="@+id/view_chain_view_first"
+        app:layout_constraintTop_toTopOf="parent" />
+
+    <View
+        android:id="@+id/view_chain_view_last"
+        style="@style/MediumBox.Variant1"
+        android:layout_width="0dp"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintHorizontal_weight="30"
+        app:layout_constraintStart_toEndOf="@+id/view_chain_view_middle"
+        app:layout_constraintTop_toTopOf="parent" />
+
+
+    <!--
+        Additional text and actions to explain the views - ignore below
+    -->
+    <TextView
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_marginTop="24dp"
+        android:gravity="center_horizontal"
+        android:text="
+        Chained views with weight \n
+
+        From left, weight is set to\n
+        layout_constraintHorizontal_weight='10',\n
+        layout_constraintHorizontal_weight='60', and\n
+        layout_constraintHorizontal_weight='30' respectively."
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:layout_constraintTop_toBottomOf="@+id/view_chain_view_middle" />
+
+
+</android.support.constraint.ConstraintLayout>

app/src/main/res/values/styles.xml

@@ -28,6 +28,10 @@
         <item name="android:background">@color/md_amber_700</item>
     </style>
 
+    <style name="MediumBox.Variant1">
+        <item name="android:background">@color/md_red_700</item>
+    </style>
+
     <style name="MediumBox.Purple">
         <item name="android:layout_width">@dimen/box_size_medium</item>
         <item name="android:layout_height">@dimen/box_size_medium</item>