Android 约束中间的弹出按钮，大小为ViewPager的1/3

我正在使用ConstraintLayout，我想在ViewPager的中心显示按钮，但宽度和高度为该页面的1/3。我使用了水平和垂直链。接下来是：

<android.support.v4.view.ViewPager
    android:id="@+id/view_pager"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:layout_marginBottom="96dp"
    android:layout_marginLeft="32dp"
    android:layout_marginRight="32dp"
    android:layout_marginTop="96dp"
    app:layout_constraintBottom_toTopOf="@+id/send_button"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

<Button
    android:id="@+id/button1"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="Button"
    app:layout_constraintHorizontal_weight="1"
    app:layout_constraintLeft_toLeftOf="@id/view_pager"
    app:layout_constraintRight_toLeftOf="@+id/button2" />

<Button
    android:id="@+id/button5"
    android:layout_width="wrap_content"
    android:layout_height="0dp"
    app:layout_constraintVertical_weight="1"
    app:layout_constraintBottom_toBottomOf="@id/view_pager"
    app:layout_constraintTop_toBottomOf="@id/button2"/>
<Button
    android:id="@+id/button4"
    android:layout_width="wrap_content"
    android:layout_height="0dp"
    app:layout_constraintVertical_weight="1"
    app:layout_constraintTop_toTopOf="@id/view_pager"
    app:layout_constraintBottom_toTopOf="@id/button2"/>
<Button
    android:id="@+id/button2"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:text="Button"
    app:layout_constraintVertical_weight="1"
    app:layout_constraintHorizontal_weight="1"
    app:layout_constraintTop_toBottomOf="@id/button4"
    app:layout_constraintBottom_toTopOf="@id/button5"
    app:layout_constraintLeft_toRightOf="@+id/button1"
    app:layout_constraintRight_toLeftOf="@+id/button3" />

<Button
    android:id="@+id/button3"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="Button"
    app:layout_constraintHorizontal_weight="1"
    app:layout_constraintLeft_toRightOf="@+id/button2"
    app:layout_constraintRight_toRightOf="@id/view_pager" />

<android.support.constraint.Guideline
    android:id="@+id/vertical_guideline"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:orientation="vertical"
    app:layout_constraintGuide_percent="0.5" />

<Button
    android:id="@+id/send_button"
    android:layout_width="0dp"
    android:layout_height="56dp"
    android:layout_marginBottom="@dimen/basic_keyline"
    android:layout_marginEnd="@dimen/basic_keyline"
    android:layout_marginLeft="8dp"
    android:layout_marginRight="@dimen/basic_keyline"
    android:layout_marginStart="8dp"
    android:background="@color/colorAccent"
    android:text="@string/send"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toRightOf="@+id/vertical_guideline"
    app:layout_constraintRight_toRightOf="parent" />

添加按钮是为了便于理解我想要什么。
您可以在
页面查看器
中插入
约束列表
，以便使用
指南
约束
按钮

<android.support.v4.view.ViewPager
android:id="@+id/view_pager"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginBottom="96dp"
android:layout_marginLeft="32dp"
android:layout_marginRight="32dp"
android:layout_marginTop="96dp"
app:layout_constraintBottom_toTopOf="@+id/send_button"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
>

<android.support.constraint.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >

    <android.support.constraint.Guideline
        android:id="@+id/left_guideline"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.33" />

    <android.support.constraint.Guideline
        android:id="@+id/right_guideline"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.67" />

    <android.support.constraint.Guideline
        android:id="@+id/top_guideline"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.33" />

    <android.support.constraint.Guideline
        android:id="@+id/bottom_guideline"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.67" />

    <Button
        android:id="@+id/button2"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:text="Button"
        app:layout_constraintTop_toBottomOf="@id/top_guideline"
        app:layout_constraintBottom_toTopOf="@id/bottom_guideline"
        app:layout_constraintLeft_toRightOf="@+id/left_guideline"
        app:layout_constraintRight_toLeftOf="@+id/right_guideline" />

</android.support.constraint.ConstraintLayout>



您可以在
页面查看器
中插入
ConstraintLayout
，以便使用
指南
约束
按钮

<android.support.v4.view.ViewPager
android:id="@+id/view_pager"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginBottom="96dp"
android:layout_marginLeft="32dp"
android:layout_marginRight="32dp"
android:layout_marginTop="96dp"
app:layout_constraintBottom_toTopOf="@+id/send_button"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
>

<android.support.constraint.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >

    <android.support.constraint.Guideline
        android:id="@+id/left_guideline"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.33" />

    <android.support.constraint.Guideline
        android:id="@+id/right_guideline"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.67" />

    <android.support.constraint.Guideline
        android:id="@+id/top_guideline"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.33" />

    <android.support.constraint.Guideline
        android:id="@+id/bottom_guideline"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.67" />

    <Button
        android:id="@+id/button2"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:text="Button"
        app:layout_constraintTop_toBottomOf="@id/top_guideline"
        app:layout_constraintBottom_toTopOf="@id/bottom_guideline"
        app:layout_constraintLeft_toRightOf="@+id/left_guideline"
        app:layout_constraintRight_toLeftOf="@+id/right_guideline" />

</android.support.constraint.ConstraintLayout>



以下是无需添加这么多按钮和指南即可完成的操作

代码如下：

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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="match_parent"
    android:fitsSystemWindows="true"
    android:orientation="vertical"    
    android:id="@+id/apbLay1"
    tools:context="studios.brilliant.com.commutech.Home">
<android.support.constraint.ConstraintLayout
    android:layout_marginBottom="152dp"
    android:layout_marginLeft="32dp"
    android:layout_marginRight="32dp"
    android:layout_marginTop="96dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    android:layout_height="0dp"
    android:layout_width="0dp"
    >
    <android.support.v4.view.ViewPager
        android:id="@+id/view_pager"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
       />    
    <Button
        android:id="@+id/button2"
        android:layout_width="0dp"
        app:layout_constraintHeight_default="percent"
        app:layout_constraintHeight_percent=".333"
        app:layout_constraintWidth_default="percent"
        app:layout_constraintWidth_percent=".333"
        android:layout_height="0dp"
        android:text="Button"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        />      
    </android.support.constraint.ConstraintLayout>    
    </android.support.constraint.ConstraintLayout>





.333是父母的33.3%，几乎等于三分之一。

额外的布局是为viewpager和button添加一个容器，因为使用viewpager作为容器可能会导致在片段可见时隐藏按钮。
以下是无需添加这么多按钮和指导原则的方法

代码如下：

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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="match_parent"
    android:fitsSystemWindows="true"
    android:orientation="vertical"    
    android:id="@+id/apbLay1"
    tools:context="studios.brilliant.com.commutech.Home">
<android.support.constraint.ConstraintLayout
    android:layout_marginBottom="152dp"
    android:layout_marginLeft="32dp"
    android:layout_marginRight="32dp"
    android:layout_marginTop="96dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    android:layout_height="0dp"
    android:layout_width="0dp"
    >
    <android.support.v4.view.ViewPager
        android:id="@+id/view_pager"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
       />    
    <Button
        android:id="@+id/button2"
        android:layout_width="0dp"
        app:layout_constraintHeight_default="percent"
        app:layout_constraintHeight_percent=".333"
        app:layout_constraintWidth_default="percent"
        app:layout_constraintWidth_percent=".333"
        android:layout_height="0dp"
        android:text="Button"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        />      
    </android.support.constraint.ConstraintLayout>    
    </android.support.constraint.ConstraintLayout>





.333是父母的33.3%，几乎等于三分之一。

额外的布局是为viewpager和按钮添加一个容器，因为当片段可见时，使用viewpager作为容器会导致按钮隐藏。
您发布的布局有多个
标记，但您的问题似乎只涉及一个
按钮。你能不能附上一张你想要的布局的图片？或者澄清这些额外按钮的用途？你能分享一下你的布局截图吗？这样我就可以很容易地理解了。@BenP。我用截图更新了我的问题。@MehulKabaria我更新了我的question@RuslanLeshchenko：共享您想要的版面？您发布的版面有多个
标记，但您的问题似乎只涉及一个
按钮。你能不能附上一张你想要的布局的图片？或者澄清这些额外按钮的用途？你能分享一下你的布局截图吗？这样我就可以很容易地理解了。@BenP。我用截图更新了我的问题。@MehulKabaria我更新了我的question@RuslanLeshchenko：共享您想要的布局？