constraintLayout的一些高级用法 布局一个16:9的图片 以及GuideLine的使用

    <!-- "W,9:16" 同样的效果 -->
    <ImageView
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:scaleType="centerCrop"
        android:src="@mipmap/icon"
        app:layout_constraintDimensionRatio="H,16:9"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"/>


guideline 使用

<android.support.constraint.Guideline
android:id="@+id/college_guideline_109dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_begin="109dp" />

设置guideLine的位置有两种方式:""

Guideline

Guideline是只能用在ConstraintLayout布局里面的一个工具类,用于辅助布局,类似为辅助线,可以设置android:orientation属性来确定是横向的还是纵向的。

  • 当设置为vertical的时候,Guideline的宽度为0,高度是parent也就是ConstraintLayout的高度
  • 同样设置为horizontal的时候,高度为0,宽度是parent的宽度

重要的是Guideline是不会显示到界面上的,默认是GONE的。

Guideline还有三个重要的属性,每个Guideline只能指定其中一个:

  • layout_constraintGuide_begin,指定左侧或顶部的固定距离,如100dp,在距离左侧或者顶部100dp的位置会出现一条辅助线
  • layout_constraintGuide_end,指定右侧或底部的固定距离,如30dp,在距离右侧或底部30dp的位置会出现一条辅助线
  • layout_constraintGuide_percent,指定在父控件中的宽度或高度的百分比,如0.8,表示距离顶部或者左侧的80%的距离。

通过一个栗子便能理解:


    <android.support.constraint.Guideline
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/guidelineBegin"
        app:layout_constraintGuide_begin="100dp"
        android:orientation="vertical"/>

    <Button
        android:text="Button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/button"
        app:layout_constraintLeft_toLeftOf="@+id/guidelineBegin"
        android:layout_marginTop="16dp"
        app:layout_constraintTop_toTopOf="parent" />

    <android.support.constraint.Guideline
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/guidelineEnd"
        app:layout_constraintGuide_end="100dp"
        android:orientation="vertical"/>

    <Button
        android:text="Button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/buttonEnd"
        app:layout_constraintRight_toLeftOf="@+id/guidelineEnd"
        android:layout_marginTop="48dp"
        app:layout_constraintTop_toTopOf="parent" />

    <android.support.constraint.Guideline
        android:id="@+id/guidelinePercent"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.8" />

    <Button
        android:text="Button3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/buttonPercent"
        app:layout_constraintLeft_toLeftOf="@+id/guidelinePercent"
        android:layout_marginTop="96dp"
        app:layout_constraintTop_toTopOf="parent" />

预览:

 

 

posted @ 2019-02-01 10:50  GLORY-HOPE  阅读(3301)  评论(0编辑  收藏  举报