Я использую ConstraintLayout
для дизайна своего экрана.
Вот мой код, который я пробовал до сих пор
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="http://schemas.android.com/apk/res-auto"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/home_bg">
<ImageView
android:id="@+id/topImage"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginTop="20dp"
android:contentDescription="@string/app_name"
android:src="@drawable/splash_heading"
app:layout_constraintStart_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/tvAllOverResult"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:padding="10dp"
android:text="@string/allover_result"
android:textColor="@color/colorBlue"
android:textSize="20sp"
android:textStyle="bold"
ads:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/topImage" />
<android.support.v7.widget.CardView
android:id="@+id/firstCardView"
android:layout_width="60dp"
android:layout_height="wrap_content"
android:layout_marginTop="2dp"
android:layout_marginEnd="10dp"
android:layout_marginBottom="2dp"
ads:cardElevation="5dp"
app:layout_constraintBottom_toBottomOf="@+id/tvVs"
app:layout_constraintEnd_toStartOf="@+id/tvVs"
app:layout_constraintTop_toTopOf="@+id/tvVs">
<abak.tr.com.boxedverticalseekbar.BoxedVertical
android:id="@+id/firstSeekBar"
android:layout_width="match_parent"
android:layout_height="250dp"
android:layout_gravity="center"
app:backgroundColor="@android:color/white"
app:defaultImage="@drawable/ic_play"
app:imageEnabled="true"
app:max="100"
app:maxImage="@drawable/ic_play"
app:minImage="@drawable/ic_play"
app:progressColor="@color/colorGreen"
app:textEnabled="false"
app:touchDisabled="false" />
</android.support.v7.widget.CardView>
<TextView
android:id="@+id/tvOneScore"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="@android:color/white"
android:gravity="center"
android:text="Streak"
android:textColor="@color/colorBlue"
android:textSize="12sp"
android:textStyle="bold"
app:layout_constraintEnd_toEndOf="@+id/firstCardView"
app:layout_constraintStart_toStartOf="@+id/firstCardView"
app:layout_constraintTop_toBottomOf="@+id/firstCardView" />
<TextView
android:id="@+id/tvVs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="V/S"
android:textColor="@color/colorBlue"
android:textSize="40sp"
android:textStyle="bold"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<android.support.v7.widget.CardView
android:id="@+id/secondCardView"
android:layout_width="60dp"
android:layout_height="250dp"
android:layout_marginStart="10dp"
app:cardElevation="5dp"
app:layout_constraintBottom_toBottomOf="@+id/tvVs"
app:layout_constraintStart_toEndOf="@+id/tvVs"
app:layout_constraintTop_toTopOf="@+id/tvVs">
<abak.tr.com.boxedverticalseekbar.BoxedVertical
android:id="@+id/secondSeekBar"
android:layout_width="match_parent"
android:layout_height="250dp"
android:layout_gravity="center"
ads:points="50"
app:backgroundColor="@android:color/white"
app:defaultImage="@drawable/ic_play"
app:imageEnabled="true"
app:max="100"
app:maxImage="@drawable/ic_play"
app:minImage="@drawable/ic_play"
app:progressColor="@color/colorGreen"
app:textEnabled="false"
app:touchDisabled="false" />
</android.support.v7.widget.CardView>
<TextView
android:id="@+id/tvTwoScore"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="@android:color/white"
android:gravity="center"
android:text="Steps"
android:textColor="@color/colorBlue"
android:textSize="12sp"
android:textStyle="bold"
app:layout_constraintEnd_toEndOf="@+id/secondCardView"
app:layout_constraintStart_toStartOf="@+id/secondCardView"
app:layout_constraintTop_toBottomOf="@+id/secondCardView" />
<TextView
android:id="@+id/tvWin"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="@android:color/white"
android:gravity="center"
android:padding="10dp"
android:textColor="@color/colorBlue"
android:text="@string/str_win"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/tvTwoScore" />
<ImageView
android:id="@+id/tvPlayGame"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_gravity="center"
android:layout_marginBottom="40dp"
android:scaleType="fitXY"
android:src="@drawable/ic_play"
app:backgroundTint="#0b961e"
app:layout_constraintBottom_toBottomOf="@id/bottomLayout"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/tvWin" />
<RelativeLayout
android:id="@+id/bottomLayout"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:paddingTop="20dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent">
<com.leinardi.android.speeddial.SpeedDialOverlayLayout
android:id="@+id/speedDialOverlayLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#81000000"
app:clickable_overlay="true"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
<com.leinardi.android.speeddial.SpeedDialOverlayLayout
android:id="@+id/speedDialOverlayLayout2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#81000000"
app:clickable_overlay="true"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
<com.leinardi.android.speeddial.SpeedDialView
android:id="@+id/speedDial"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@id/mAdView"
android:layout_alignParentEnd="true"
ads:layout_constraintEnd_toEndOf="parent"
ads:layout_constraintHorizontal_bias="0.5"
app:backgroundTint="@android:color/white"
app:layout_behavior="@string/speeddial_scrolling_view_snackbar_behavior"
app:sdExpansionMode="top"
app:sdMainFabAnimationRotateAngle="90"
app:sdMainFabClosedBackgroundColor="@android:color/white"
app:sdMainFabClosedSrc="@drawable/ic_settings"
app:sdMainFabOpenedBackgroundColor="#4e4c4c"
app:sdMainFabOpenedSrc="@drawable/ic_close"
app:sdUseReverseAnimationOnClose="true" />
<com.leinardi.android.speeddial.SpeedDialView
android:id="@+id/langSpeedDial"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@id/mAdView"
android:layout_alignParentStart="true"
android:layout_marginStart="8dp"
ads:layout_constraintHorizontal_bias="0.5"
ads:layout_constraintStart_toStartOf="parent"
app:layout_behavior="@string/speeddial_scrolling_view_snackbar_behavior"
app:sdExpansionMode="top"
app:sdMainFabAnimationRotateAngle="90"
app:sdMainFabClosedBackgroundColor="@android:color/white"
app:sdMainFabClosedSrc="@drawable/ic_language"
app:sdMainFabOpenedBackgroundColor="#4e4c4c"
app:sdMainFabOpenedSrc="@drawable/ic_close"
app:sdUseReverseAnimationOnClose="true" />
<com.google.android.gms.ads.AdView
android:id="@+id/mAdView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
ads:adSize="BANNER"
ads:adUnitId="@string/bannerID" />
</RelativeLayout>
</android.support.constraint.ConstraintLayout>
Я столкнулся с проблемой ниже, используя приведенный выше код
- на маленьком экране
imageview
прячется заaddview
- Когда я прячу
addview
, нижняя частьSpeedDialView
не регулируется - Как ограничить
SpeedDialView
тем, что когда я скрываюaddview
, он будет работать так же, как когдаaddview
виден
скриншот проблемы
Я проверил некоторые посты SO
- ConstraintLayout, когда представление, зависящее от ограничений, исчезло, представление макета ведет себя странно
- сохранять поле, когда указанное представление исчезает в ConstraintLayout
- goneMargin не соблюдается в обертке ConstraintLayout?
- https://stackoverflow.com/a/2386929/8112541
- Android — выровнять центр просмотра по нижней части другого вида
Пожалуйста, проверьте приведенный ниже экран, мой ожидаемый результат
Может ли кто-нибудь помочь мне создать этот макет, используя макет ConstraintLayout
Если вам нужна дополнительная информация, пожалуйста, дайте мне знать. Заранее спасибо. Ваши усилия будут оценены.