| Anastasia Soboleva | 1de1d10 | 2019-09-30 16:48:31 +0100 | [diff] [blame] | 1 | /* |
| 2 | * Copyright 2019 The Android Open Source Project |
| 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 androidx.ui.layout.samples |
| 18 | |
| 19 | import androidx.annotation.Sampled |
| Anastasia Soboleva | 1de1d10 | 2019-09-30 16:48:31 +0100 | [diff] [blame] | 20 | import androidx.compose.Composable |
| Matvei Malkov | 59bac36 | 2020-02-13 20:23:13 +0000 | [diff] [blame] | 21 | import androidx.ui.foundation.Box |
| Anastasia Soboleva | 1de1d10 | 2019-09-30 16:48:31 +0100 | [diff] [blame] | 22 | import androidx.ui.graphics.Color |
| Anastasia Soboleva | 29bef5e | 2019-10-22 16:50:15 +0100 | [diff] [blame] | 23 | import androidx.ui.layout.Column |
| George Mount | 842c8c1 | 2020-01-08 16:03:42 -0800 | [diff] [blame] | 24 | import androidx.ui.layout.LayoutAlign |
| Adam Powell | 712dc99 | 2019-12-04 12:48:30 -0800 | [diff] [blame] | 25 | import androidx.ui.layout.LayoutGravity |
| Adam Powell | 31c1ebd | 2020-01-09 09:48:24 -0800 | [diff] [blame] | 26 | import androidx.ui.layout.LayoutHeight |
| Mihai Popa | 5f43e9d | 2020-02-12 14:14:46 +0000 | [diff] [blame] | 27 | import androidx.ui.layout.LayoutSize |
| Adam Powell | 31c1ebd | 2020-01-09 09:48:24 -0800 | [diff] [blame] | 28 | import androidx.ui.layout.LayoutWidth |
| Anastasia Soboleva | 29bef5e | 2019-10-22 16:50:15 +0100 | [diff] [blame] | 29 | import androidx.ui.layout.Row |
| George Mount | 842c8c1 | 2020-01-08 16:03:42 -0800 | [diff] [blame] | 30 | import androidx.ui.unit.dp |
| Anastasia Soboleva | 1de1d10 | 2019-09-30 16:48:31 +0100 | [diff] [blame] | 31 | |
| 32 | @Sampled |
| 33 | @Composable |
| Anastasia Soboleva | b8a60b9 | 2019-11-28 16:46:04 +0000 | [diff] [blame] | 34 | fun SimpleAlignedModifier() { |
| Mihai Popa | 5f43e9d | 2020-02-12 14:14:46 +0000 | [diff] [blame] | 35 | // Here, the blue rectangle prefers to have a 20.dp size, subject to the incoming constraints. |
| 36 | // Because of the LayoutSize.Min modifier, if LayoutAlign was not present, the blue rectangle |
| 37 | // would actually be 40.dp x 40.dp to satisfy the min size set by the modifier. However, |
| 38 | // because we also provide LayoutAlign, the blue rectangle is allowed to be smaller than the min |
| 39 | // constraints, and it will be aligned in the 40.dp x 40.dp space. Note the example would not |
| 40 | // work if LayoutAlign was specified before LayoutSize in the modifier chain. |
| Matvei Malkov | 59bac36 | 2020-02-13 20:23:13 +0000 | [diff] [blame] | 41 | Box( |
| 42 | modifier = LayoutSize(20.dp) + LayoutSize.Min(40.dp, 40.dp) + LayoutAlign.TopCenter, |
| 43 | backgroundColor = Color.Blue |
| Mihai Popa | 5f43e9d | 2020-02-12 14:14:46 +0000 | [diff] [blame] | 44 | ) |
| Anastasia Soboleva | b8a60b9 | 2019-11-28 16:46:04 +0000 | [diff] [blame] | 45 | } |
| 46 | |
| 47 | @Sampled |
| 48 | @Composable |
| 49 | fun SimpleVerticallyAlignedModifier() { |
| Mihai Popa | 5f43e9d | 2020-02-12 14:14:46 +0000 | [diff] [blame] | 50 | // Here, the blue rectangle prefers to have a 50.dp height, subject to the incoming constraints. |
| 51 | // Because of the LayoutSize.Fill modifier, if LayoutAlign was not present, the blue rectangle |
| 52 | // would actually fill the available height to satisfy the min height set by the modifier. |
| 53 | // However, because we also provide LayoutAlign, the blue rectangle is allowed to be smaller |
| 54 | // than the min height, and it will be centered vertically in the available height. |
| 55 | // The width of the rectangle will still fill the available width, because the |
| 56 | // LayoutAlign.CenterVertically modifier is only concerned with vertical alignment. |
| 57 | // Note the example would not work if LayoutAlign was specified before LayoutSize |
| 58 | // in the modifier chain. |
| Matvei Malkov | 59bac36 | 2020-02-13 20:23:13 +0000 | [diff] [blame] | 59 | Box( |
| 60 | LayoutSize(50.dp) + LayoutSize.Fill + LayoutAlign.CenterVertically, |
| 61 | backgroundColor = Color.Blue |
| Mihai Popa | 5f43e9d | 2020-02-12 14:14:46 +0000 | [diff] [blame] | 62 | ) |
| Anastasia Soboleva | b8a60b9 | 2019-11-28 16:46:04 +0000 | [diff] [blame] | 63 | } |
| 64 | |
| 65 | @Sampled |
| 66 | @Composable |
| Anastasia Soboleva | 29bef5e | 2019-10-22 16:50:15 +0100 | [diff] [blame] | 67 | fun SimpleGravityInRow() { |
| Adam Powell | 31c1ebd | 2020-01-09 09:48:24 -0800 | [diff] [blame] | 68 | Row(LayoutHeight.Fill) { |
| Anastasia Soboleva | 29bef5e | 2019-10-22 16:50:15 +0100 | [diff] [blame] | 69 | // The child with no gravity modifier is positioned by default so that its top edge is |
| 70 | // aligned to the top of the vertical axis. |
| Matvei Malkov | 59bac36 | 2020-02-13 20:23:13 +0000 | [diff] [blame] | 71 | Box(LayoutSize(80.dp, 40.dp), backgroundColor = Color.Magenta) |
| Anastasia Soboleva | 29bef5e | 2019-10-22 16:50:15 +0100 | [diff] [blame] | 72 | // Gravity.Top, the child will be positioned so that its top edge is aligned to the top |
| 73 | // of the vertical axis. |
| Matvei Malkov | 59bac36 | 2020-02-13 20:23:13 +0000 | [diff] [blame] | 74 | Box(LayoutSize(80.dp, 40.dp) + LayoutGravity.Top, backgroundColor = Color.Red) |
| Anastasia Soboleva | 29bef5e | 2019-10-22 16:50:15 +0100 | [diff] [blame] | 75 | // Gravity.Center, the child will be positioned so that its center is in the middle of |
| 76 | // the vertical axis. |
| Matvei Malkov | 59bac36 | 2020-02-13 20:23:13 +0000 | [diff] [blame] | 77 | Box(LayoutSize(80.dp, 40.dp) + LayoutGravity.Center, backgroundColor = Color.Yellow) |
| Anastasia Soboleva | 29bef5e | 2019-10-22 16:50:15 +0100 | [diff] [blame] | 78 | // Gravity.Bottom, the child will be positioned so that its bottom edge is aligned to the |
| 79 | // bottom of the vertical axis. |
| Matvei Malkov | 59bac36 | 2020-02-13 20:23:13 +0000 | [diff] [blame] | 80 | Box(LayoutSize(80.dp, 40.dp) + LayoutGravity.Bottom, backgroundColor = Color.Green) |
| Anastasia Soboleva | 29bef5e | 2019-10-22 16:50:15 +0100 | [diff] [blame] | 81 | } |
| 82 | } |
| 83 | |
| 84 | @Sampled |
| 85 | @Composable |
| 86 | fun SimpleGravityInColumn() { |
| Adam Powell | 31c1ebd | 2020-01-09 09:48:24 -0800 | [diff] [blame] | 87 | Column(LayoutWidth.Fill) { |
| Anastasia Soboleva | 29bef5e | 2019-10-22 16:50:15 +0100 | [diff] [blame] | 88 | // The child with no gravity modifier is positioned by default so that its start edge |
| 89 | // aligned with the start edge of the horizontal axis. |
| Matvei Malkov | 59bac36 | 2020-02-13 20:23:13 +0000 | [diff] [blame] | 90 | Box(LayoutSize(80.dp, 40.dp), backgroundColor = Color.Magenta) |
| Anastasia Soboleva | 29bef5e | 2019-10-22 16:50:15 +0100 | [diff] [blame] | 91 | // Gravity.Start, the child will be positioned so that its start edge is aligned with |
| 92 | // the start edge of the horizontal axis. |
| Matvei Malkov | 59bac36 | 2020-02-13 20:23:13 +0000 | [diff] [blame] | 93 | Box(LayoutSize(80.dp, 40.dp) + LayoutGravity.Start, backgroundColor = Color.Red) |
| Anastasia Soboleva | 29bef5e | 2019-10-22 16:50:15 +0100 | [diff] [blame] | 94 | // Gravity.Center, the child will be positioned so that its center is in the middle of |
| 95 | // the horizontal axis. |
| Matvei Malkov | 59bac36 | 2020-02-13 20:23:13 +0000 | [diff] [blame] | 96 | Box(LayoutSize(80.dp, 40.dp) + LayoutGravity.Center, backgroundColor = Color.Yellow) |
| Anastasia Soboleva | 29bef5e | 2019-10-22 16:50:15 +0100 | [diff] [blame] | 97 | // Gravity.End, the child will be positioned so that its end edge aligned to the end of |
| 98 | // the horizontal axis. |
| Matvei Malkov | 59bac36 | 2020-02-13 20:23:13 +0000 | [diff] [blame] | 99 | Box(LayoutSize(80.dp, 40.dp) + LayoutGravity.End, backgroundColor = Color.Green) |
| Anastasia Soboleva | 29bef5e | 2019-10-22 16:50:15 +0100 | [diff] [blame] | 100 | } |
| 101 | } |