以编程方式在约束布局中重新约束视图

时间:2019-12-22 16:08:06

标签: android kotlin android-constraintlayout

我有一个带有多个视图的约束布局,我想以编程方式对它们进行排序。我尝试使用activity_main.xml,但无法正常工作。

我创建了一个示例应用程序来演示该问题 这是<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:id="@+id/grid" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingTop="5dp" android:theme="@style/Theme.MaterialComponents.DayNight"> <androidx.constraintlayout.widget.Guideline android:id="@+id/leftGuide" android:layout_width="0dp" android:layout_height="0dp" android:orientation="vertical" app:layout_constraintGuide_percent="0.02" /> <androidx.constraintlayout.widget.Guideline android:id="@+id/rightGuide" android:layout_width="0dp" android:layout_height="0dp" android:orientation="vertical" app:layout_constraintGuide_percent="0.98" /> <androidx.constraintlayout.widget.Guideline android:id="@+id/topGuide" android:layout_width="0dp" android:layout_height="0dp" android:orientation="horizontal" app:layout_constraintGuide_percent="0.02" /> <com.google.android.material.card.MaterialCardView android:id="@+id/myApp" android:layout_width="0dp" android:layout_height="117dp" app:cardBackgroundColor="#FFFDE7" app:cardCornerRadius="22dp" app:cardElevation="3dp" app:layout_constraintEnd_toStartOf="@id/cat" app:layout_constraintHorizontal_chainStyle="spread_inside" app:layout_constraintStart_toEndOf="@id/leftGuide" app:layout_constraintTop_toBottomOf="@id/topGuide" app:layout_constraintWidth_percent="0.3"> <ImageView android:layout_width="60dp" android:layout_height="60dp" android:layout_gravity="center" android:layout_marginBottom="8dp" android:contentDescription="@string/app_name" android:src="@drawable/ic_launcher_background" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="bottom|center" android:layout_marginBottom="3dp" android:maxWidth="100dp" android:maxHeight="60dp" android:text="@string/app_name" android:textAppearance="@style/TextAppearance.AppCompat.Medium" android:textColor="#EB2B2313" android:textSize="14sp" /> </com.google.android.material.card.MaterialCardView> <com.google.android.material.card.MaterialCardView android:id="@+id/cat" android:layout_width="0dp" android:layout_height="117dp" app:cardBackgroundColor="#FFFDE7" app:cardCornerRadius="22dp" app:cardElevation="3dp" app:layout_constraintEnd_toStartOf="@id/kicks" app:layout_constraintStart_toEndOf="@id/myApp" app:layout_constraintTop_toTopOf="@id/topGuide" app:layout_constraintWidth_percent="0.3"> <ImageView android:layout_width="57dp" android:layout_height="57dp" android:layout_gravity="center" android:layout_marginBottom="6dp" android:contentDescription="@string/app_name" android:src="@drawable/ic_launcher_foreground" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="bottom|center" android:layout_marginBottom="3dp" android:maxWidth="100dp" android:maxHeight="60dp" android:text="cat" android:textAppearance="@style/TextAppearance.AppCompat.Medium" android:textColor="#EB2B2313" android:textSize="14sp" /> </com.google.android.material.card.MaterialCardView> <com.google.android.material.card.MaterialCardView android:id="@+id/kicks" android:layout_width="0dp" android:layout_height="117dp" app:cardBackgroundColor="#FFFDE7" app:cardCornerRadius="22dp" app:cardElevation="3dp" app:layout_constraintEnd_toStartOf="@id/rightGuide" app:layout_constraintStart_toEndOf="@id/cat" app:layout_constraintTop_toTopOf="@id/topGuide" app:layout_constraintWidth_percent="0.3"> <ImageView android:layout_width="60dp" android:layout_height="60dp" android:layout_gravity="center" android:layout_marginBottom="6dp" android:contentDescription="@string/app_name" android:src="@drawable/ic_launcher_foreground" /> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="bottom|center" android:layout_marginBottom="3dp" android:maxWidth="100dp" android:maxHeight="60dp" android:text="kicks" android:textAppearance="@style/TextAppearance.AppCompat.Medium" android:textColor="#EB2B2313" android:textSize="14sp" /> </com.google.android.material.card.MaterialCardView> </androidx.constraintlayout.widget.ConstraintLayout> 文件。

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        myApp.setOnClickListener {
           val constrain = ConstraintSet()
           constrain.apply {
               clone(this@MainActivity,R.layout.activity_main)
               connect(myApp.id,ConstraintSet.END,rightGuide.id,ConstraintSet.START,0)
               connect(myApp.id,ConstraintSet.START,kicks.id,ConstraintSet.END,0)
               connect(cat.id,ConstraintSet.START,leftGuide.id,ConstraintSet.END,0)
               connect(cat.id,ConstraintSet.END,kicks.id,ConstraintSet.START,0)
               connect(kicks.id,ConstraintSet.END,myApp.id,ConstraintSet.START,0)
               connect(kicks.id,ConstraintSet.START,cat.id,ConstraintSet.END,0)

               applyTo(grid)
            }
        }
    }
}

like的外观如下。

但是我想通过编程方式更改约束,使其看起来像this

这是我尝试过的

{{1}}

但这就是我get

1 个答案:

答案 0 :(得分:0)

似乎是约束布局2.0.0.beta2的错误。 升级到Beta 4(当前最新版本)后,它将产生预期的结果。