如何使用Percentage for android layout？

Question

我们如何使用android视图元素的百分比值？这样的事情

<TextView
        android:id="@+id/"
        android:layout_width="75%"
        android:layout_height="50%"/>

Answer 1

2018年更新:

PercentRelativeLayout并且PercentFrameLayout已弃用.考虑使用ConstraintLayout

旧答案:

到目前为止Android支持库限制了在哪里使用它:

1. 同 RelativeLayout

   android.support.percent.PercentRelativeLayout
   

2. 同 FrameLayout

   android.support.percent.PercentFrameLayout
   

如何使用它？

好吧,首先确保build.grade(Module: app)在Android应用程序中包含依赖项 .

dependencies {
    compile 'com.android.support:percent:23.3.0'
}

然后导航到此示例中的xml布局(.MainActivity)

<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:paddingBottom="@dimen/activity_vertical_margin"
  android:paddingLeft="@dimen/activity_horizontal_margin"
  android:paddingRight="@dimen/activity_horizontal_margin"
  android:paddingTop="@dimen/activity_vertical_margin"
  tools:context=".MainActivity">


  <Button
    android:id="@+id/button"
    android:text="Button"
    android:layout_height="wrap_content"
    android:layout_alignParentTop="true"
    app:layout_widthPercent="30%"/>

  <Button    
    android:id="@+id/button2"
    android:text="Button 2"
    android:layout_height="wrap_content"
    android:layout_toRightOf="@id/button"
    app:layout_widthPercent="60%"/>

  <Button
    android:id="@+id/button3"
    android:text="Button 3"
    android:layout_height="wrap_content"
    android:layout_below="@+id/button"
    android:layout_alignParentStart="true"
    android:layout_alignParentLeft="true"
    app:layout_widthPercent="90%"/>

</android.support.percent.PercentRelativeLayout>

有关详细信息,请在此处查看:

Answer 2

支持库只添加了百分比布局.

它可以这样做

 <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">
     <ImageView
         app:layout_widthPercent="50%"
         app:layout_heightPercent="50%"
         app:layout_marginTopPercent="25%"
         app:layout_marginLeftPercent="25%"/>
 </android.support.percent.PercentFrameLayout>

https://developer.android.com/reference/android/support/percent/PercentFrameLayout.html

Answer 3

您可以使用PercentRelativeLayout,它是设计支持库中最近未记录的附加内容,使您不仅可以指定彼此相对的元素,还可以指定可用空间的总百分比.

结构是

<android.support.percent.PercentRelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >
    <ImageView
        android:id="@+id/imageview"
        android:layout_gravity="center"
        app:layout_widthPercent="50%"
        app:layout_heightPercent="50%"
        android:src="@mipmap/ic_launcher"
        android:background="#cecece"/>
    <TextView
        android:id="@+id/textview1"
        android:layout_below="@id/imageview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_marginStartPercent="25%"
        app:layout_marginEndPercent="25%"
        android:text="PercentRelativeLayout example"
        android:background="#bebebe"/>


</android.support.percent.PercentRelativeLayout>

该百分比包提供的API可支持添加和您的应用程序管理基于百分比尺寸.

要使用,您需要将此库添加到your Gradle dependency列表:

dependencies {
    compile 'com.android.support:percent:22.2.0'
    // or compile 'com.android.support:percent:23.1.0'
}

出于演示目的,您可以访问Git android-percent-support-lib-sample.

Answer 4

使用PercentFrameLayout和PercentRelativeLayout在26.0.0中删除,您需要使用ConstraintLayout百分比值来调整TextView的大小.

ConstraintLayout是构建Android平台响应式UI的强大工具,您可以在此处找到更多详细信息使用ConstraintLayout构建响应式UI.

下面是使用ConstraintLayout如何调整TextView大小(w = 75%,h = 50%)的示例:

<android.support.constraint.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">

    <android.support.constraint.Guideline
        android:id="@+id/ver_guideline"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        app:layout_constraintGuide_percent="0.75"/>

    <android.support.constraint.Guideline
        android:id="@+id/hor_guideline"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.5"/>

    <TextView
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginBottom="0dp"
        android:layout_marginEnd="0dp"
        android:layout_marginStart="0dp"
        android:layout_marginTop="0dp"
        app:layout_constraintBottom_toTopOf="@+id/hor_guideline"
        app:layout_constraintEnd_toStartOf="@+id/ver_guideline"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</android.support.constraint.ConstraintLayout>

不要忘记将constraint-layout依赖项添加到模块build.gradle文件中

dependencies {
    ...
    implementation 'com.android.support.constraint:constraint-layout:1.0.2'
    ...
}

或者直接在布局编辑器中编辑您的布局,如下所示:

因此,您的TextView宽度是父宽度的75%,高度是父高度的50%:

Answer 5

Google推出了名为android.support.percent的新API

示例PercentRelativeLayout

 <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">
     <TextView
         android:id="@+id/myTextView"
         app:layout_widthPercent="75%"
         app:layout_heightPercent="50%"/>
 </android.support.percent.PercentFrameLayout>