【约束布局】使用 Design 模式编辑 ConstraintLayout 约束布局 ( 添加 Guideline 引导线

这篇具有很好参考价值的文章主要介绍了【约束布局】使用 Design 模式编辑 ConstraintLayout 约束布局 ( 添加 Guideline 引导线 | 添加 FragmentContainerView )。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

一、使用 Design 模式编辑 ConstraintLayout 约束布局

向约束布局 ConstraintLayout 中添加两个 Fragment , 垂直方向各占 50 % , 一个在屏幕上半部分 , 一个占据屏幕下半部分 ;

1、添加 Guideline 引导线

向约束布局中添加一条 Guideline 引导线 , 点击布局中的 Guidelines 按钮 ,

【约束布局】使用 Design 模式编辑 ConstraintLayout 约束布局 ( 添加 Guideline 引导线 | 添加 FragmentContainerView )
在弹出的下拉菜单中 , 选择 Horizontal Guideline 水平引导线 ,

【约束布局】使用 Design 模式编辑 ConstraintLayout 约束布局 ( 添加 Guideline 引导线 | 添加 FragmentContainerView )

此时在下方的界面中 , 就会出现一条 Guideline 引导线 , 默认显示的单位是像素 ,

【约束布局】使用 Design 模式编辑 ConstraintLayout 约束布局 ( 添加 Guideline 引导线 | 添加 FragmentContainerView )

双击左侧的三角按钮 , 就可以切换像素值 / 百分比显示 , 百分比显示效果如下 :

【约束布局】使用 Design 模式编辑 ConstraintLayout 约束布局 ( 添加 Guideline 引导线 | 添加 FragmentContainerView )
将其拖动到 50% 处 , 该 Guideline 引导线作为 Fragment 的分割线 , 同时 Fragment 的底部可以依赖该引导线 ;

2、添加 Fragment1

要想向约束布局中添加 Fragment , 首先要创建 Fragment 的类 , 这里创建两个 Fragment 类 :

Fragment1 :

package kim.hsl.livedatademo

import androidx.fragment.app.Fragment

class Fragment1: Fragment() {
}

Fragment2 :

package kim.hsl.livedatademo

import androidx.fragment.app.Fragment

class Fragment2: Fragment() {
}

在布局文件的 Design 模式下 , 将 FragmentContainerView 拖动到界面上半部分 ,

【约束布局】使用 Design 模式编辑 ConstraintLayout 约束布局 ( 添加 Guideline 引导线 | 添加 FragmentContainerView )

拖动鼠标松开时 , 会弹出对话框 , 让我们选择要插入那个 Fragment , 之前创建了两个 Fragment , 分别是

Fragment1
Fragment2

这里先插入 Fragment1 ,

【约束布局】使用 Design 模式编辑 ConstraintLayout 约束布局 ( 添加 Guideline 引导线 | 添加 FragmentContainerView )

选择 Fragment1 后 , 成功插入 , 右侧提示没有水平依赖和垂直依赖 ;

【约束布局】使用 Design 模式编辑 ConstraintLayout 约束布局 ( 添加 Guideline 引导线 | 添加 FragmentContainerView )

生成的代码如下 :

    <androidx.fragment.app.FragmentContainerView
        android:id="@+id/fragmentContainerView1"
        android:name="kim.hsl.livedatademo.Fragment1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        tools:layout_editor_absoluteX="204dp"
        tools:layout_editor_absoluteY="182dp" />

拖动鼠标为其添加依赖 :
【约束布局】使用 Design 模式编辑 ConstraintLayout 约束布局 ( 添加 Guideline 引导线 | 添加 FragmentContainerView )

将右侧的布局宽高设置为 0dp , 也就是默认 match_parent 充满布局 ;

【约束布局】使用 Design 模式编辑 ConstraintLayout 约束布局 ( 添加 Guideline 引导线 | 添加 FragmentContainerView )
生成的代码如下 :

    <androidx.fragment.app.FragmentContainerView
        android:id="@+id/fragmentContainerView1"
        android:name="kim.hsl.livedatademo.Fragment1"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintBottom_toTopOf="@+id/guideline"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

3、添加 Fragment2

再次拖动 FragmentContainerView 拖动到界面下半部分 , 这次选择插入 Fragment2 组件 ,

【约束布局】使用 Design 模式编辑 ConstraintLayout 约束布局 ( 添加 Guideline 引导线 | 添加 FragmentContainerView )
为其添加布局 , 并填充满父容器 ;

【约束布局】使用 Design 模式编辑 ConstraintLayout 约束布局 ( 添加 Guideline 引导线 | 添加 FragmentContainerView ) 文章来源地址https://www.toymoban.com/news/detail-406253.html

到了这里，关于【约束布局】使用 Design 模式编辑 ConstraintLayout 约束布局 ( 添加 Guideline 引导线 | 添加 FragmentContainerView )的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！