Question

我正在尝试使用percentRelativeLayout使我的应用程序的屏幕大小为屏幕宽度的90％和屏幕高度的50％。

我的布局由两个片段组成：1）左侧是4个按钮，2）右侧是一个容器，每个按钮点击插入一个不同的片段。

当我使用percentRelativeLayout或percentFrameLayout使屏幕的高度为50％，屏幕的宽度为90％时，我得到的结果如下所示，我的片段为50％高度和90％宽度INSIDE一个盒子，它占整个屏幕高度的50％，占整个屏幕宽度的90％。有谁知道我怎么解决这个问题？

我已经尝试将layout_height和width设置为match_parent用于我的两个布局，结果是相同的，或者应用程序占用整个屏幕。我还确保使用占据整个屏幕的主题，而不是Dialog主题。我也尝试使用一个父RelativeLayout和一个嵌入在其中的percentRelativeLayout，layout_widthPercent和layout_heightPercent应用于我的片段，我得到相同的结果。

<android.support.percent.PercentFrameLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:android="http://schemas.android.com/apk/res/android">

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_gravity="center"
    android:background="@drawable/rounded_edges"
    android:theme="@style/Theme.AppCompat.Light.NoActionBar"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"
    app:layout_widthPercent="90%"
    app:layout_heightPercent="50%"
    >
<fragment
    android:id="@+id/menuFragment"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_margin="5dp"
    class="it.anddev.bradipao.janus.MenuFragment"
    tools:layout="@layout/fr_menu">
</fragment>

<FrameLayout
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

</LinearLayout>

</android.support.percent.PercentFrameLayout>

Here is what I want it to look like

Here is what it looks like now

Answer 1

看起来您的菜单片段的宽度大约占其对话框样式父级总宽度的30％，内容大约占70％。我会在PercentRelativeLayout内使用PercentFrameLayout，如下所示

<?xml version="1.0" encoding="utf-8"?>
<android.support.percent.PercentFrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.percent.PercentRelativeLayout 
        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:layout_gravity="center"
        android:background="@drawable/rounded_edges"
        android:theme="@style/Theme.AppCompat.Light.NoActionBar"
        app:layout_heightPercent="50%"
        app:layout_widthPercent="90%">

        <fragment
            android:id="@+id/menuFragment"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_margin="5dp"
            android:layout_alignParentStart="true"
            app:layout_widthPercent="30%"
            class="it.anddev.bradipao.janus.MenuFragment"
            tools:layout="@layout/fr_menu">
        </fragment>


        <FrameLayout
            android:id="@+id/container"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_toEndOf="@+id/menuFragment" />

    </android.support.percent.PercentRelativeLayout>

</android.support.percent.PercentFrameLayout>

至于欢迎片段后面出现的双白色背景，如果不查看其布局文件，我无法确切地告诉它为什么会这样。您可能希望在container FrameLayout

中删除您替换的所有片段的布局背景

Answer 2

我已更改为显示button的内容已移除menu fragment，其中包含四个buttons以模仿您想要的图片作为结果，您可以替换这四个buttons使用menu fragment

<?xml version="1.0" encoding="utf-8"?>
<android.support.percent.PercentFrameLayout 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"
    android:background="@android:color/transparent">

    <LinearLayout 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"
        android:layout_gravity="center"
        android:background="@android:color/holo_blue_dark"
        android:padding="4dp"
        app:layout_heightPercent="50%"
        app:layout_marginPercent="5%"
        app:layout_widthPercent="90%">

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_gravity="center_vertical"
            android:layout_margin="4dp"
            android:layout_weight="0.3"
            android:background="@android:color/holo_purple"
            android:contentDescription="this is where you can keep your buttons"
            android:gravity="center"
            android:orientation="vertical">


            <Button
                android:layout_width="wrap_content"
                android:layout_height="0dp"
                android:layout_margin="4dp"
                android:layout_weight="1"
                android:text="First"
                android:textAllCaps="false" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="0dp"
                android:layout_margin="4dp"
                android:layout_weight="1"
                android:text="Second"
                android:textAllCaps="false" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="0dp"
                android:layout_margin="4dp"
                android:layout_weight="1"
                android:text="Third"
                android:textAllCaps="false" />

            <Button
                android:layout_width="wrap_content"
                android:layout_height="0dp"
                android:layout_margin="4dp"
                android:layout_weight="1"
                android:text="Forth"
                android:textAllCaps="false" />
        </LinearLayout>

        <FrameLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_gravity="bottom"
            android:layout_margin="4dp"
            android:layout_weight="0.7"
            android:background="@android:color/holo_green_dark"
            android:contentDescription="this would be your frame container"></FrameLayout>
    </LinearLayout>

</android.support.percent.PercentFrameLayout>

输出

如何使应用程序占屏幕大小的百分比

2 个答案: