バックグラウンド
Google は、「ConstraintLayout」と呼ばれる新しいレイアウトを発表しました。これは究極のレイアウトであり、すべてのレイアウトをフラットなまま (ネストされたレイアウトなしで) 置き換え、パフォーマンスを向上させることができます。
問題
つまり、Google IO で提示されたビデオを除いて、この問題に役立つチュートリアルはほとんどありません。
私がやろうとしているのは、別のレイアウト内に垂直方向に中央揃えされた LinearLayout があることを考えると、両方を単一の ConstraintLayout に変換することです。
結局のところ、これがこの新しいレイアウトの目的です...
私が扱いたいレイアウトは次のようになります。
中央のビューは垂直方向にのみ中央に配置され、2 つの textView は ImageView の右側にあり、これも垂直方向に中央に配置されていることに注意してください。
これはすべて、2 つの TextView の LinearLayout を持つ RelativeLayout でうまく機能しますが、それらを単一の ConstraintLayout に変換する方法を知りたいです。
以下は、私が示したもののサンプル XML です。
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/listPreferredItemHeightSmall">
<ImageView
android:id="@+id/appIconImageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:layout_marginEnd="4dp"
android:layout_marginLeft="2dp"
android:layout_marginRight="4dp"
android:layout_marginStart="2dp"
android:adjustViewBounds="true"
android:src="@android:drawable/sym_def_app_icon"
tools:ignore="ContentDescription"/>
<LinearLayout
android:id="@+id/appDetailsContainer"
android:layout_width="0px"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toEndOf="@+id/appIconImageView"
android:layout_toLeftOf="@+id/overflowView"
android:layout_toRightOf="@+id/appIconImageView"
android:layout_toStartOf="@+id/overflowView"
android:orientation="vertical">
<TextView
android:id="@+id/appLabelTextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ellipsize="marquee"
android:text="label"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textDirection="locale"
tools:ignore="HardcodedText,UnusedAttribute"/>
<TextView
android:id="@+id/appDescriptionTextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ellipsize="marquee"
android:minLines="3"
android:text="description"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textDirection="locale"
tools:ignore="HardcodedText,UnusedAttribute"/>
</LinearLayout>
<ImageView
android:id="@+id/overflowView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:adjustViewBounds="true"
android:background="?attr/selectableItemBackground"
android:clickable="true"
android:padding="10dp"
app:srcCompat="@drawable/ic_more_vert_black_24dp"
tools:src="@drawable/ic_more_vert_black_24dp"
tools:ignore="ContentDescription"/>
<ImageView
android:id="@+id/isSystemAppImageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignEnd="@+id/overflowView"
android:layout_alignLeft="@+id/overflowView"
android:layout_alignParentBottom="true"
android:layout_alignRight="@+id/overflowView"
android:layout_alignStart="@+id/overflowView"
android:adjustViewBounds="true"
android:scaleType="centerInside"
app:srcCompat="@drawable/ic_warning_black_24dp"
tools:ignore="ContentDescription"
tools:src="@drawable/ic_warning_black_24dp"/>
</RelativeLayout>
私が試したこと
私はいくつかの記事を読み、いくつかの Google のビデオを見ようとしました :
- https://codelabs.developers.google.com/codelabs/constraint-layout/index.html#0
- https://www.youtube.com/watch?v=sO9aX87hq9c
- https://youtu.be/csaXml4xtN8?t=1693
それは役に立たなかったので、自分で使い方を見つけたいと思って使ってみました。しかし、私はそれを行う方法を見つけることができません。この機能を使用してレイアウトを変換しようとしましたが、これによりビューが大幅に混乱し、不要なマージンが追加されます。
質問
2 つのレイアウトを単一の ConstraintLayout に変換するにはどうすればよいですか?