【问题标题】:How to use new features in constraint layout 1.1?如何在约束布局 1.1 中使用新功能?
【发布时间】:2017-05-20 19:26:49
【问题描述】:

有谁知道如何使用约束布局 1.1 中的新功能,即障碍和基于百分比的尺寸?网上绝对没有可用的文档,最近关于设计器工具的 Google I/O 演讲仅详细介绍了占位符。顺便说一句,我发现了如何使用组,这也是一个新功能。您只需添加

<android.support.constraint.Group
    app:constraint_referenced_ids="button1, button2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"/>

到您的约束布局,其中 app:constraint_referenced_ids 是一个字符串,您应该在其中枚举您希望与该组关联的视图的逗号分隔 ID。现在,切换组的可见性会改变它所引用的所有视图的可见性,我认为这是这个功能的主要目的。

【问题讨论】:

  • 有一个为选定视图创建组的快捷方式。它将以应该包含的方式自动包含所有 id。你应该试试看。百分比还有 3 个新属性(只需输入“app:per”并观看 Android Studio 提示)。
  • 谢谢!我去看看。

标签: android android-constraintlayout


【解决方案1】:

更新:An official release of Constraint Layout 1.1.0 终于来了,complete with official documentation!


Documentation 的新功能在第一次被问到这个问题时非常稀缺。我能找到的最好的是this Reddit post!但是那里的信息给了我足够的提示来创建一个带有水平屏障的约束布局。它确实有效,并且新的(测试版)约束布局还修复了wrap_content 的一些不好的问题。我对 Constraint Layout Beta 的第一印象非常积极,在许多额外的测试中都得到了支持。

在使用新东西之前,将ConstraintLayout 1.1.0添加到项目中。

app/build.gradle中,将约束布局依赖改成这样:

implementation 'com.android.support.constraint:constraint-layout:1.1.0'

您可能还需要将 maven 存储库添加到项目的 build.gradle(这是一个不同的文件,位于项目的根目录中)。查找 allprojects repositories 部分并添加:maven { url 'https://maven.google.com' } 所以整个部分应如下所示:

allprojects {
     repositories {
         jcenter()
         maven { url 'https://maven.google.com' }
     }
}

现在来看看有趣的东西! 下面的 sn-p 创建了一个水平屏障,因此bottom_textview 低于included_layoutmultiline_textview

<android.support.constraint.Barrier
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/barrier1"
    app:barrierDirection="bottom"
    app:constraint_referenced_ids="included_layout, multiline_textview" />

<TextView
    android:id="@+id/bottom_textview"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/barrier1"
    android:layout_width="0dp"
    android:layout_height="wrap_content" />

第一印象:障碍很棒!我的新布局更扁平更简单,而且似乎仍然完全符合我的要求。绝对值得一试。

更详细的文档正在逐渐变得可用:

@Vyacheslav A 的回答也很好地总结了新功能可以做什么。

【讨论】:

  • 感谢您的信息!
  • 我们真的需要这些行吗,例如,错过了app:layout_constraintLeft_toLeftOf="parent"app:layout_constraintRight_toRightOf="parent"app:layout_constraintTop_toBottomOf="@+id/multiline_textview"
  • 你是对的,@Lemberg!我已经相应地更新了答案。
【解决方案2】:

1.百分比尺寸

宽度为 0dp(或 match_constraint)的小部件的默认行为是展开的(可通过 layout_constraintWidth_default 属性进行配置)。在 ConstraintLayout 1.0.x 中,我们可以选择将其更改为 wrap,而在 1.1.x 中,我们有一个新值 percent,允许我们将小部件设置为占用可用空间的某个百分比。

    <!-- the widget will take 40% of the available space -->
    app:layout_constraintWidth_default="percent"
    app:layout_constraintWidth_percent="0.4"

2。障碍

在这个新的小部件中,我们有一些来自 ConstraintLayout.com 的示例。障碍将避免一个或多个小部件绕过障碍。发生这种情况时,屏障将自行移动,并避免将小部件放置在其上方。 在下面的示例中,text1 和 text2 的 end 属性都不能绕过障碍。发生这种情况时,Barrier 将向右移动(或向左移动,如果在 RTL 布局中)。这在处理不同的小部件尺寸时尤其少见,具体取决于某些配置或国际化。

<android.support.constraint.ConstraintLayout...>
  <TextView
    android:id="@+id/text1" ... />
  <TextView
    android:id="@+id/text2" ... />
  <android.support.constraint.Barrier
    android:id="@+id/barrier"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:barrierDirection="end" <!-- start, top, bottom, right... -->
    app:constraint_referenced_ids="text1,text2" />
  <TextView
    android:id="@+id/text3"
    ...
    app:layout_constraintStart_toEndOf="@+id/barrier" />
</android.support.constraint.ConstraintLayout>

3.群组

组,就像指南一样,是大小为 0 的小部件。但组有助于将一些操作应用于一组小部件。最常见的情况是控制小部件集合的可见性。在处理这种情况时,最常见的解决方案是在 Activity 或 Fragment 内部维护一个列表或一组视图,甚至添加一个 ViewGroup 并将所有视图放入其中,控制容器的可见性。现在,您只需要将它们的 id 添加到 Group 中,group 就会将操作传播到所有插入的视图。

<android.support.constraint.ConstraintLayout ...>
  <TextView
    android:id="@+id/text1" ... />
  <TextView
    android:id="@+id/text2" ... />
  <android.support.constraint.Group
    android:id="@+id/group"
    ...
    app:constraint_referenced_ids="text1,text2" />
</android.support.constraint.ConstraintLayout>

在这种情况下,如果我们调用

group.setVisibility(View.GONE);

那么 text1 和 text2 将收到 GONE 可见性。

text here

description here.的官方文档

【讨论】:

    【解决方案3】:

    有一些关于屏障here的信息。

    【讨论】:

    • 始终欢迎提供指向潜在解决方案的链接,但请在链接周围添加上下文,以便您的其他用户了解它是什么以及它存在的原因。始终引用重要链接中最相关的部分,以防目标站点无法访问或永久离线。看看Why and how are some answers deleted?How do I write a good answer?
    【解决方案4】:

    这里是official doc,它完美地解释了约束布局 1.1 中添加的所有新功能

    Groups 需要注意的另一件事是,如果您将视图作为 Group 中的参考 ID,则其单独的可见性将不起作用,为此您需要创建一个单独的为之分组。 如果我错了,请纠正我。 这是使用 Group 的示例代码,您可以在此处看到 view1's 可见性将不起作用,因为它被分配给了一个组。

        <?xml version="1.0" encoding="utf-8"?>
        <android.support.constraint.ConstraintLayout 
            xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:app="http://schemas.android.com/apk/res-auto"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
    
        <android.support.constraint.Group
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:visibility="visible"
            app:constraint_referenced_ids="view1,view2" />
    
        <View
            android:id="@+id/view1"
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:background="@android:color/black"
            android:visibility="gone"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent" />
    
        <View
            android:id="@+id/view2"
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:background="@android:color/darker_gray"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/view1" />
    
        <View
            android:id="@+id/view3"
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:background="@android:color/holo_blue_light"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/view2" />
    
        <View
            android:id="@+id/view4"
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:background="@android:color/holo_red_light"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/view3" />
    
    </android.support.constraint.ConstraintLayout>
    

    现在要克服这个问题,我们可以创建一个新组来处理 view1 的可见性,如下所示。

    <android.support.constraint.Group
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           app:constraint_referenced_ids="view1" />
    

    这是我遇到的解决方法,如果有这样的场景,我们想要在不同情况下处理组的可见性以及单个视图的可见性。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2020-06-28
      • 2018-07-17
      • 2018-12-12
      • 1970-01-01
      • 2020-01-16
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多