使用约束布局等距四张图片
Equally spaced four images using constraint layout
我想使用约束布局同样地 spaced 四张图片...我已经使用了指南,但它给了我很多 space 图片和右角图片之间的差距屏幕
我想要这样的东西 -->
但是我从下面的代码中得到这个 -->
我试过的另一台设备运行它没有给出预期的结果
代码如下:--
<androidx.drawerlayout.widget.DrawerLayout
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:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="start">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/holder"
android:layout_width="match_parent"
android:background="#000000"
android:layout_height="match_parent"
android:orientation="vertical">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/content"
android:layout_width="match_parent"
android:background="#ffffff"
android:layout_height="match_parent"
android:orientation="vertical">
<androidx.appcompat.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/toolbar"
app:titleTextColor="#ffffff"
app:title="@string/app_name"
android:background="@color/colorPrimary"
tools:ignore="MissingConstraints" />
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/cvcxv"
android:layout_below="@id/toolbar"
app:layout_constraintTop_toBottomOf="@id/toolbar"
tools:ignore="MissingConstraints">
<androidx.viewpager.widget.ViewPager
android:layout_width="match_parent"
android:layout_height="687px"
android:id="@+id/viewpagerhome"
tools:ignore="MissingConstraints" />
<com.viewpagerindicator.CirclePageIndicator
android:id="@+id/indicator"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="-30dp"
android:layout_marginBottom="-3dp"
android:gravity="bottom"
app:layout_constraintBottom_toBottomOf="parent"
android:padding="10dip"
app:centered="true"
app:fillColor="@color/colorPrimary"
app:pageColor="#FFFFFF"
app:snap="false"
tools:ignore="MissingConstraints" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_gravity="bottom"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:gravity="bottom"
android:orientation="vertical"
app:layout_constraintBottom_toBottomOf="parent">
<Button
android:id="@+id/image1"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginEnd="4dp"
android:layout_marginRight="4dp"
android:background="@drawable/chairsicon"
app:layout_constraintDimensionRatio="h,1:1"
app:layout_constraintEnd_toStartOf="@id/image2"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/image2"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="4dp"
android:layout_marginLeft="4dp"
android:background="@drawable/chairsicon"
app:layout_constraintDimensionRatio="h,1:1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/image1"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/image3"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="4dp"
android:layout_marginRight="4dp"
android:background="@drawable/chairsicon"
app:layout_constraintDimensionRatio="h,1:1"
app:layout_constraintEnd_toStartOf="@id/image4"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/image1" />
<Button
android:id="@+id/image4"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="4dp"
android:layout_marginLeft="4dp"
android:layout_marginTop="8dp"
android:background="@drawable/chairsicon"
app:layout_constraintDimensionRatio="h,1:1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/image3"
app:layout_constraintTop_toBottomOf="@id/image2" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
<com.google.android.material.navigation.NavigationView
android:id="@+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="@android:color/transparent"
android:layout_gravity="start"
app:itemTextColor="#ffffff"
app:headerLayout="@layout/nav_header_main"
app:menu="@menu/menu"
app:itemIconTint="#ffffff"
app:itemBackground="@drawable/drawer_item_bg"
/>
</drawer>
不同的设备给出不同的输出但不是想要的输出(第一张图片)
需要帮助才能适合所有设备(小型设备到大型设备)
移除辅助线,您可以设置此视图给定高度比并使视图适合这样,
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffff"
android:orientation="vertical">
<androidx.appcompat.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorPrimary"
app:title="@string/app_name"
app:titleTextColor="#ffffff"
tools:ignore="MissingConstraints" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guideline50"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.5" />
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/cvcxv"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_below="@id/toolbar"
android:background="@color/colorBlackNormal"
app:layout_constraintBottom_toTopOf="@id/guideline50"
app:layout_constraintTop_toBottomOf="@id/toolbar"
tools:ignore="MissingConstraints">
<androidx.viewpager.widget.ViewPager
android:id="@+id/viewpagerhome"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:ignore="MissingConstraints" />
<com.viewpagerindicator.CirclePageIndicator
android:id="@+id/indicator"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="-30dp"
android:layout_marginBottom="-3dp"
android:gravity="bottom"
android:padding="10dip"
app:centered="true"
app:fillColor="@color/colorPrimary"
app:layout_constraintBottom_toBottomOf="parent"
app:pageColor="#FFFFFF"
app:snap="false"
tools:ignore="MissingConstraints" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_gravity="bottom"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:gravity="bottom"
android:orientation="vertical"
app:layout_constraintTop_toBottomOf="@id/cvcxv"
app:layout_constraintBottom_toBottomOf="parent">
<Button
android:id="@+id/image1"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginEnd="4dp"
android:layout_marginRight="4dp"
android:background="@drawable/chairsicon"
app:layout_constraintDimensionRatio="h,1:1"
app:layout_constraintEnd_toStartOf="@id/image2"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/image2"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="4dp"
android:layout_marginLeft="4dp"
android:background="@drawable/chairsicon"
app:layout_constraintDimensionRatio="h,1:1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/image1"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/image3"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="4dp"
android:layout_marginRight="4dp"
android:background="@drawable/chairsicon"
app:layout_constraintDimensionRatio="h,1:1"
app:layout_constraintEnd_toStartOf="@id/image4"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/image1" />
<Button
android:id="@+id/image4"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="4dp"
android:layout_marginLeft="4dp"
android:layout_marginTop="8dp"
android:background="@drawable/chairsicon"
app:layout_constraintDimensionRatio="h,1:1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/image3"
app:layout_constraintTop_toBottomOf="@id/image2" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
它将在所有设备中给出预期的结果
你可以测试下面的代码:
<androidx.constraintlayout.widget.ConstraintLayout 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:layout_gravity="bottom"
android:gravity="bottom"
android:orientation="vertical"
app:layout_constraintBottom_toBottomOf="parent">
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guideline_vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.50" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guideline_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.50" />
<Button
android:id="@+id/image2"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="5dp"
android:background="@drawable/ic_launcher_background"
app:layout_constraintBottom_toTopOf="@+id/guideline_horizontal"
app:layout_constraintDimensionRatio="1"
app:layout_constraintEnd_toStartOf="@+id/guideline_vertical"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/image3"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="10dp"
android:background="@drawable/ic_launcher_background"
app:layout_constraintBottom_toTopOf="@+id/guideline_horizontal"
app:layout_constraintDimensionRatio="1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="@+id/guideline_vertical"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/image4"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="10dp"
android:background="@drawable/ic_launcher_background"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintDimensionRatio="1"
app:layout_constraintEnd_toStartOf="@+id/guideline_vertical"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/guideline_horizontal" />
<Button
android:id="@+id/buttonMiddle"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="10dp"
android:visibility="visible"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintDimensionRatio="1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="@+id/guideline_vertical"
app:layout_constraintTop_toTopOf="@+id/guideline_horizontal" />
</androidx.constraintlayout.widget.ConstraintLayout>
不确定您对问题的确切要求,但我可以看到您需要在设备上显示 4 个宽度和高度相等的正方形。
您不需要在垂直方向和水平方向都使用 guideline,而是垂直分布,您可以使用 barrier 来正确对齐它们。
查看下面的代码:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.viewpager.widget.ViewPager
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="4dp"
app:layout_constraintBottom_toTopOf="@id/image_divider"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/vertical_divider"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent=".5" />
<androidx.constraintlayout.widget.Barrier
android:id="@+id/image_divider"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:barrierDirection="top"
app:constraint_referenced_ids="view1, view2" />
<androidx.constraintlayout.widget.Barrier
android:id="@+id/horizontal_divider"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:barrierDirection="top"
app:constraint_referenced_ids="view3, view4" />
<View
android:id="@+id/view1"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="4dp"
android:background="@android:color/holo_orange_dark"
app:layout_constraintBottom_toTopOf="@id/horizontal_divider"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintEnd_toStartOf="@id/vertical_divider"
app:layout_constraintStart_toStartOf="parent" />
<View
android:id="@+id/view2"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="4dp"
android:background="@android:color/holo_orange_light"
app:layout_constraintBottom_toTopOf="@id/horizontal_divider"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/vertical_divider" />
<View
android:id="@+id/view3"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="4dp"
android:background="@android:color/holo_red_light"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintEnd_toStartOf="@id/vertical_divider"
app:layout_constraintStart_toStartOf="parent" />
<View
android:id="@+id/view4"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="4dp"
android:background="@android:color/holo_red_dark"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/vertical_divider" />
</androidx.constraintlayout.widget.ConstraintLayout>
输出:
(这将在不同的屏幕尺寸上保持一致)
这里,vertical guidelines用于在水平方向上均匀分布视图,而barrier用于在垂直方向上对齐两个视图。
尺寸比例用于使正方形与0dp
高度和宽度一致。
编辑: O.P。寻求在底部用方框排列整个视图层次结构的解决方案,下面给出完整代码:
<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.widget.DrawerLayout 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:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="start">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffff"
android:orientation="vertical">
<androidx.appcompat.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="@color/colorPrimary"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:title="@string/app_name"
app:titleTextColor="#ffffff"
tools:ignore="MissingConstraints" />
<androidx.viewpager.widget.ViewPager
android:id="@+id/viewpagerhome"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="4dp"
app:layout_constraintBottom_toTopOf="@id/image_divider"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/toolbar"
tools:ignore="NotSibling" />
<com.viewpagerindicator.CirclePageIndicator
android:id="@+id/indicator"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="-30dp"
android:layout_marginBottom="-3dp"
android:gravity="bottom"
android:padding="10dip"
app:centered="true"
app:fillColor="@color/colorPrimary"
app:layout_constraintBottom_toBottomOf="@id/viewpagerhome"
app:layout_constraintEnd_toEndOf="@id/viewpagerhome"
app:layout_constraintStart_toStartOf="@id/viewpagerhome"
app:pageColor="#FFFFFF"
app:snap="false" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/vertical_divider"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent=".5" />
<androidx.constraintlayout.widget.Barrier
android:id="@+id/image_divider"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:barrierDirection="top"
app:constraint_referenced_ids="view1, view2" />
<androidx.constraintlayout.widget.Barrier
android:id="@+id/horizontal_divider"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:barrierDirection="top"
app:constraint_referenced_ids="view3, view4" />
<View
android:id="@+id/view1"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="4dp"
android:background="@drawable/tableicon"
app:layout_constraintBottom_toTopOf="@id/horizontal_divider"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintEnd_toStartOf="@id/vertical_divider"
app:layout_constraintStart_toStartOf="parent" />
<View
android:id="@+id/view2"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="4dp"
android:background="@drawable/sofaicon"
app:layout_constraintBottom_toTopOf="@id/horizontal_divider"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/vertical_divider" />
<View
android:id="@+id/view3"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="4dp"
android:background="@drawable/chairsicon"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintEnd_toStartOf="@id/vertical_divider"
app:layout_constraintStart_toStartOf="parent" />
<View
android:id="@+id/view4"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="4dp"
android:background="@drawable/cupboardicon"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/vertical_divider" />
</androidx.constraintlayout.widget.ConstraintLayout>
<com.google.android.material.navigation.NavigationView
android:id="@+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="@android:color/transparent"
app:headerLayout="@layout/nav_header_main"
app:itemBackground="@drawable/drawer_item_bg"
app:itemIconTint="#ffffff"
app:itemTextColor="#ffffff"
app:menu="@menu/menu" />
</androidx.drawerlayout.widget.DrawerLayout>
检查这是否适合您。
<androidx.drawerlayout.widget.DrawerLayout
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:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="start">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/holder"
android:layout_width="match_parent"
android:background="#000000"
android:layout_height="match_parent"
android:orientation="vertical">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/content"
android:layout_width="match_parent"
android:background="#ffffff"
android:layout_height="match_parent"
android:orientation="vertical">
<androidx.appcompat.widget.Toolbar
android:layout_width="0dp"
android:layout_height="wrap_content"
android:id="@+id/toolbar"
app:titleTextColor="#ffffff"
app:title="@string/app_name"
android:background="@color/colorPrimary"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"/>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="0dp"
android:layout_height="0dp"
android:id="@+id/cvcxv"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toTopOf="@id/images_container"
app:layout_constraintStart_toStartOf="parent"
android:layout_below="@id/toolbar"
app:layout_constraintTop_toBottomOf="@id/toolbar"
>
<androidx.viewpager.widget.ViewPager
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
android:id="@+id/viewpagerhome"
tools:ignore="MissingConstraints" />
<com.viewpagerindicator.CirclePageIndicator
android:id="@+id/indicator"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="-30dp"
android:layout_marginBottom="-3dp"
android:gravity="bottom"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:padding="10dip"
app:centered="true"
app:fillColor="@color/colorPrimary"
app:pageColor="#FFFFFF"
app:snap="false"
/>
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/images_container"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintHeight_percent="0.5"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent">
<Button
android:id="@+id/image1"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="4dp"
android:layout_marginTop="4dp"
android:layout_marginEnd="2dp"
android:background="@drawable/lake"
app:layout_constraintBottom_toTopOf="@+id/image3"
app:layout_constraintEnd_toStartOf="@+id/image2"
app:layout_constraintHeight_percent="0.48"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintWidth_percent="0.48" />
<Button
android:id="@+id/image2"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="2dp"
android:layout_marginTop="4dp"
android:layout_marginEnd="4dp"
android:background="@drawable/test"
app:layout_constraintBottom_toTopOf="@+id/image4"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHeight_percent="0.48"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="@+id/image1"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintWidth_percent="0.48" />
<Button
android:id="@+id/image3"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="@drawable/test"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="@+id/image4"
app:layout_constraintHeight_percent="0.48"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/image1"
app:layout_constraintWidth_percent="0.48" />
<Button
android:id="@+id/image4"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="@drawable/lake"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHeight_percent="0.48"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="@+id/image3"
app:layout_constraintTop_toBottomOf="@+id/image2"
app:layout_constraintWidth_percent="0.48" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
<com.google.android.material.navigation.NavigationView
android:id="@+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="@android:color/transparent"
android:layout_gravity="start"
app:itemTextColor="#ffffff"
app:headerLayout="@layout/nav_header_main"
app:menu="@menu/menu"
app:itemIconTint="#ffffff"
app:itemBackground="@drawable/drawer_item_bg"
/>
</androidx.drawerlayout.widget.DrawerLayout>
我想使用约束布局同样地 spaced 四张图片...我已经使用了指南,但它给了我很多 space 图片和右角图片之间的差距屏幕
我想要这样的东西 -->
但是我从下面的代码中得到这个 -->
我试过的另一台设备运行它没有给出预期的结果
代码如下:--
<androidx.drawerlayout.widget.DrawerLayout
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:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="start">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/holder"
android:layout_width="match_parent"
android:background="#000000"
android:layout_height="match_parent"
android:orientation="vertical">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/content"
android:layout_width="match_parent"
android:background="#ffffff"
android:layout_height="match_parent"
android:orientation="vertical">
<androidx.appcompat.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/toolbar"
app:titleTextColor="#ffffff"
app:title="@string/app_name"
android:background="@color/colorPrimary"
tools:ignore="MissingConstraints" />
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/cvcxv"
android:layout_below="@id/toolbar"
app:layout_constraintTop_toBottomOf="@id/toolbar"
tools:ignore="MissingConstraints">
<androidx.viewpager.widget.ViewPager
android:layout_width="match_parent"
android:layout_height="687px"
android:id="@+id/viewpagerhome"
tools:ignore="MissingConstraints" />
<com.viewpagerindicator.CirclePageIndicator
android:id="@+id/indicator"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="-30dp"
android:layout_marginBottom="-3dp"
android:gravity="bottom"
app:layout_constraintBottom_toBottomOf="parent"
android:padding="10dip"
app:centered="true"
app:fillColor="@color/colorPrimary"
app:pageColor="#FFFFFF"
app:snap="false"
tools:ignore="MissingConstraints" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_gravity="bottom"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:gravity="bottom"
android:orientation="vertical"
app:layout_constraintBottom_toBottomOf="parent">
<Button
android:id="@+id/image1"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginEnd="4dp"
android:layout_marginRight="4dp"
android:background="@drawable/chairsicon"
app:layout_constraintDimensionRatio="h,1:1"
app:layout_constraintEnd_toStartOf="@id/image2"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/image2"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="4dp"
android:layout_marginLeft="4dp"
android:background="@drawable/chairsicon"
app:layout_constraintDimensionRatio="h,1:1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/image1"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/image3"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="4dp"
android:layout_marginRight="4dp"
android:background="@drawable/chairsicon"
app:layout_constraintDimensionRatio="h,1:1"
app:layout_constraintEnd_toStartOf="@id/image4"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/image1" />
<Button
android:id="@+id/image4"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="4dp"
android:layout_marginLeft="4dp"
android:layout_marginTop="8dp"
android:background="@drawable/chairsicon"
app:layout_constraintDimensionRatio="h,1:1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/image3"
app:layout_constraintTop_toBottomOf="@id/image2" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
<com.google.android.material.navigation.NavigationView
android:id="@+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="@android:color/transparent"
android:layout_gravity="start"
app:itemTextColor="#ffffff"
app:headerLayout="@layout/nav_header_main"
app:menu="@menu/menu"
app:itemIconTint="#ffffff"
app:itemBackground="@drawable/drawer_item_bg"
/>
</drawer>
不同的设备给出不同的输出但不是想要的输出(第一张图片)
需要帮助才能适合所有设备(小型设备到大型设备)
移除辅助线,您可以设置此视图给定高度比并使视图适合这样,
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffff"
android:orientation="vertical">
<androidx.appcompat.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorPrimary"
app:title="@string/app_name"
app:titleTextColor="#ffffff"
tools:ignore="MissingConstraints" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guideline50"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.5" />
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/cvcxv"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_below="@id/toolbar"
android:background="@color/colorBlackNormal"
app:layout_constraintBottom_toTopOf="@id/guideline50"
app:layout_constraintTop_toBottomOf="@id/toolbar"
tools:ignore="MissingConstraints">
<androidx.viewpager.widget.ViewPager
android:id="@+id/viewpagerhome"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:ignore="MissingConstraints" />
<com.viewpagerindicator.CirclePageIndicator
android:id="@+id/indicator"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="-30dp"
android:layout_marginBottom="-3dp"
android:gravity="bottom"
android:padding="10dip"
app:centered="true"
app:fillColor="@color/colorPrimary"
app:layout_constraintBottom_toBottomOf="parent"
app:pageColor="#FFFFFF"
app:snap="false"
tools:ignore="MissingConstraints" />
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_gravity="bottom"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:gravity="bottom"
android:orientation="vertical"
app:layout_constraintTop_toBottomOf="@id/cvcxv"
app:layout_constraintBottom_toBottomOf="parent">
<Button
android:id="@+id/image1"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginEnd="4dp"
android:layout_marginRight="4dp"
android:background="@drawable/chairsicon"
app:layout_constraintDimensionRatio="h,1:1"
app:layout_constraintEnd_toStartOf="@id/image2"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/image2"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="4dp"
android:layout_marginLeft="4dp"
android:background="@drawable/chairsicon"
app:layout_constraintDimensionRatio="h,1:1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/image1"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/image3"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="4dp"
android:layout_marginRight="4dp"
android:background="@drawable/chairsicon"
app:layout_constraintDimensionRatio="h,1:1"
app:layout_constraintEnd_toStartOf="@id/image4"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/image1" />
<Button
android:id="@+id/image4"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="4dp"
android:layout_marginLeft="4dp"
android:layout_marginTop="8dp"
android:background="@drawable/chairsicon"
app:layout_constraintDimensionRatio="h,1:1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/image3"
app:layout_constraintTop_toBottomOf="@id/image2" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
它将在所有设备中给出预期的结果
你可以测试下面的代码:
<androidx.constraintlayout.widget.ConstraintLayout 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:layout_gravity="bottom"
android:gravity="bottom"
android:orientation="vertical"
app:layout_constraintBottom_toBottomOf="parent">
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guideline_vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.50" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guideline_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.50" />
<Button
android:id="@+id/image2"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="5dp"
android:background="@drawable/ic_launcher_background"
app:layout_constraintBottom_toTopOf="@+id/guideline_horizontal"
app:layout_constraintDimensionRatio="1"
app:layout_constraintEnd_toStartOf="@+id/guideline_vertical"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/image3"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="10dp"
android:background="@drawable/ic_launcher_background"
app:layout_constraintBottom_toTopOf="@+id/guideline_horizontal"
app:layout_constraintDimensionRatio="1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="@+id/guideline_vertical"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/image4"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="10dp"
android:background="@drawable/ic_launcher_background"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintDimensionRatio="1"
app:layout_constraintEnd_toStartOf="@+id/guideline_vertical"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/guideline_horizontal" />
<Button
android:id="@+id/buttonMiddle"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="10dp"
android:visibility="visible"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintDimensionRatio="1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="@+id/guideline_vertical"
app:layout_constraintTop_toTopOf="@+id/guideline_horizontal" />
</androidx.constraintlayout.widget.ConstraintLayout>
不确定您对问题的确切要求,但我可以看到您需要在设备上显示 4 个宽度和高度相等的正方形。
您不需要在垂直方向和水平方向都使用 guideline,而是垂直分布,您可以使用 barrier 来正确对齐它们。
查看下面的代码:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.viewpager.widget.ViewPager
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="4dp"
app:layout_constraintBottom_toTopOf="@id/image_divider"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/vertical_divider"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent=".5" />
<androidx.constraintlayout.widget.Barrier
android:id="@+id/image_divider"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:barrierDirection="top"
app:constraint_referenced_ids="view1, view2" />
<androidx.constraintlayout.widget.Barrier
android:id="@+id/horizontal_divider"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:barrierDirection="top"
app:constraint_referenced_ids="view3, view4" />
<View
android:id="@+id/view1"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="4dp"
android:background="@android:color/holo_orange_dark"
app:layout_constraintBottom_toTopOf="@id/horizontal_divider"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintEnd_toStartOf="@id/vertical_divider"
app:layout_constraintStart_toStartOf="parent" />
<View
android:id="@+id/view2"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="4dp"
android:background="@android:color/holo_orange_light"
app:layout_constraintBottom_toTopOf="@id/horizontal_divider"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/vertical_divider" />
<View
android:id="@+id/view3"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="4dp"
android:background="@android:color/holo_red_light"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintEnd_toStartOf="@id/vertical_divider"
app:layout_constraintStart_toStartOf="parent" />
<View
android:id="@+id/view4"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="4dp"
android:background="@android:color/holo_red_dark"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/vertical_divider" />
</androidx.constraintlayout.widget.ConstraintLayout>
输出:
(这将在不同的屏幕尺寸上保持一致)
这里,vertical guidelines用于在水平方向上均匀分布视图,而barrier用于在垂直方向上对齐两个视图。
尺寸比例用于使正方形与0dp
高度和宽度一致。
编辑: O.P。寻求在底部用方框排列整个视图层次结构的解决方案,下面给出完整代码:
<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.widget.DrawerLayout 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:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="start">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffffff"
android:orientation="vertical">
<androidx.appcompat.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="@color/colorPrimary"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:title="@string/app_name"
app:titleTextColor="#ffffff"
tools:ignore="MissingConstraints" />
<androidx.viewpager.widget.ViewPager
android:id="@+id/viewpagerhome"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="4dp"
app:layout_constraintBottom_toTopOf="@id/image_divider"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@id/toolbar"
tools:ignore="NotSibling" />
<com.viewpagerindicator.CirclePageIndicator
android:id="@+id/indicator"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="-30dp"
android:layout_marginBottom="-3dp"
android:gravity="bottom"
android:padding="10dip"
app:centered="true"
app:fillColor="@color/colorPrimary"
app:layout_constraintBottom_toBottomOf="@id/viewpagerhome"
app:layout_constraintEnd_toEndOf="@id/viewpagerhome"
app:layout_constraintStart_toStartOf="@id/viewpagerhome"
app:pageColor="#FFFFFF"
app:snap="false" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/vertical_divider"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent=".5" />
<androidx.constraintlayout.widget.Barrier
android:id="@+id/image_divider"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:barrierDirection="top"
app:constraint_referenced_ids="view1, view2" />
<androidx.constraintlayout.widget.Barrier
android:id="@+id/horizontal_divider"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:barrierDirection="top"
app:constraint_referenced_ids="view3, view4" />
<View
android:id="@+id/view1"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="4dp"
android:background="@drawable/tableicon"
app:layout_constraintBottom_toTopOf="@id/horizontal_divider"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintEnd_toStartOf="@id/vertical_divider"
app:layout_constraintStart_toStartOf="parent" />
<View
android:id="@+id/view2"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="4dp"
android:background="@drawable/sofaicon"
app:layout_constraintBottom_toTopOf="@id/horizontal_divider"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/vertical_divider" />
<View
android:id="@+id/view3"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="4dp"
android:background="@drawable/chairsicon"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintEnd_toStartOf="@id/vertical_divider"
app:layout_constraintStart_toStartOf="parent" />
<View
android:id="@+id/view4"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_margin="4dp"
android:background="@drawable/cupboardicon"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintDimensionRatio="1:1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@id/vertical_divider" />
</androidx.constraintlayout.widget.ConstraintLayout>
<com.google.android.material.navigation.NavigationView
android:id="@+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="@android:color/transparent"
app:headerLayout="@layout/nav_header_main"
app:itemBackground="@drawable/drawer_item_bg"
app:itemIconTint="#ffffff"
app:itemTextColor="#ffffff"
app:menu="@menu/menu" />
</androidx.drawerlayout.widget.DrawerLayout>
检查这是否适合您。
<androidx.drawerlayout.widget.DrawerLayout
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:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="start">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/holder"
android:layout_width="match_parent"
android:background="#000000"
android:layout_height="match_parent"
android:orientation="vertical">
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/content"
android:layout_width="match_parent"
android:background="#ffffff"
android:layout_height="match_parent"
android:orientation="vertical">
<androidx.appcompat.widget.Toolbar
android:layout_width="0dp"
android:layout_height="wrap_content"
android:id="@+id/toolbar"
app:titleTextColor="#ffffff"
app:title="@string/app_name"
android:background="@color/colorPrimary"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"/>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="0dp"
android:layout_height="0dp"
android:id="@+id/cvcxv"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toTopOf="@id/images_container"
app:layout_constraintStart_toStartOf="parent"
android:layout_below="@id/toolbar"
app:layout_constraintTop_toBottomOf="@id/toolbar"
>
<androidx.viewpager.widget.ViewPager
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
android:id="@+id/viewpagerhome"
tools:ignore="MissingConstraints" />
<com.viewpagerindicator.CirclePageIndicator
android:id="@+id/indicator"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="-30dp"
android:layout_marginBottom="-3dp"
android:gravity="bottom"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
android:padding="10dip"
app:centered="true"
app:fillColor="@color/colorPrimary"
app:pageColor="#FFFFFF"
app:snap="false"
/>
</androidx.constraintlayout.widget.ConstraintLayout>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="@+id/images_container"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintHeight_percent="0.5"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent">
<Button
android:id="@+id/image1"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="4dp"
android:layout_marginTop="4dp"
android:layout_marginEnd="2dp"
android:background="@drawable/lake"
app:layout_constraintBottom_toTopOf="@+id/image3"
app:layout_constraintEnd_toStartOf="@+id/image2"
app:layout_constraintHeight_percent="0.48"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintWidth_percent="0.48" />
<Button
android:id="@+id/image2"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="2dp"
android:layout_marginTop="4dp"
android:layout_marginEnd="4dp"
android:background="@drawable/test"
app:layout_constraintBottom_toTopOf="@+id/image4"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHeight_percent="0.48"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="@+id/image1"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintWidth_percent="0.48" />
<Button
android:id="@+id/image3"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="@drawable/test"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="@+id/image4"
app:layout_constraintHeight_percent="0.48"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/image1"
app:layout_constraintWidth_percent="0.48" />
<Button
android:id="@+id/image4"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="@drawable/lake"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHeight_percent="0.48"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="@+id/image3"
app:layout_constraintTop_toBottomOf="@+id/image2"
app:layout_constraintWidth_percent="0.48" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
<com.google.android.material.navigation.NavigationView
android:id="@+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="@android:color/transparent"
android:layout_gravity="start"
app:itemTextColor="#ffffff"
app:headerLayout="@layout/nav_header_main"
app:menu="@menu/menu"
app:itemIconTint="#ffffff"
app:itemBackground="@drawable/drawer_item_bg"
/>
</androidx.drawerlayout.widget.DrawerLayout>