วิธีการจัดกึ่งกลางเนื้อหาภายในเค้าโครงเชิงเส้น?


155

ฉันพยายามที่จะจัดวางImageViewด้านในเป็นLinearLayoutแนวนอนและแนวตั้ง แต่ฉันก็ทำไม่ได้ สาเหตุหลักที่ฉันไม่ได้ใช้RelativeLayoutเพราะเป็นเพราะฉันต้องการlayout_weight(ของฉันActivityประกอบด้วยสี่คอลัมน์ที่ควรแบ่งเท่า ๆ กันและตอบสนองต่อความกว้างของหน้าจอที่แตกต่างกันแต่ละคอลัมน์มีImageViewจุดศูนย์กลางและไม่ยืดออก)

นี่คือ xml ของฉันจนถึงตอนนี้:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#000"
    android:baselineAligned="false"
    android:gravity="center"
    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=".Main" >

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_weight="1" >

        <ImageView
            android:id="@+id/imageButton_speak"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/image_bg"
            android:src="@drawable/ic_speak" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_weight="1" >

        <ImageView
            android:id="@+id/imageButton_readtext"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/image_bg"
            android:src="@drawable/ic_readtext" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_weight="1" >

        <ImageView
            android:id="@+id/imageButton_edit"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/image_bg"
            android:src="@drawable/ic_edit" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_weight="1" >

        <ImageView
            android:id="@+id/imageButton_config"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/image_bg"
            android:src="@drawable/ic_config" />
    </LinearLayout>
</LinearLayout>

โพสต์ภาพหน้าจอตามที่คุณต้องการและภาพหน้าจอปัจจุบัน
Yogesh Tatwal

คำตอบ:


381

android:gravity จัดการการจัดตำแหน่งของเด็ก ๆ

android:layout_gravity จัดการการจัดตำแหน่งของตัวเอง

ดังนั้นใช้อย่างใดอย่างหนึ่งเหล่านี้

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#000"
    android:baselineAligned="false"
    android:gravity="center"
    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=".Main" >

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:gravity="center" >

        <ImageView
            android:id="@+id/imageButton_speak"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/image_bg"
            android:src="@drawable/ic_speak" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:gravity="center" >

        <ImageView
            android:id="@+id/imageButton_readtext"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/image_bg"
            android:src="@drawable/ic_readtext" />
    </LinearLayout>

    ...
</LinearLayout>

หรือ

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#000"
    android:baselineAligned="false"
    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=".Main" >

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_weight="1" >

        <ImageView
            android:id="@+id/imageButton_speak"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:background="@drawable/image_bg"
            android:src="@drawable/ic_speak" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_weight="1" >

        <ImageView
            android:id="@+id/imageButton_readtext"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:background="@drawable/image_bg"
            android:src="@drawable/ic_readtext" />
    </LinearLayout>

    ...
</LinearLayout>

"android: layout_gravity ดูแลตัวเอง" จะแก้ไขว่าเค้าโครงแรงโน้มถ่วงถูกใช้โดยผู้ปกครอง
ataulm

36

android:layout_gravity ใช้สำหรับโครงร่างเอง

ใช้android:gravity="center"สำหรับเด็กของคุณLinearLayout

ดังนั้นรหัสของคุณควรเป็น:

<LinearLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:layout_weight="1" >

7

ฉันลองวิธีแก้ปัญหาที่กล่าวถึงที่นี่ แต่มันไม่ได้ช่วยฉัน ผมทราบการแก้ปัญหาคือlayout_widthต้องใช้wrap_contentเป็นค่า

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:layout_weight="1" >

5

นี่คือตัวอย่างรหัส สิ่งนี้ใช้ได้สำหรับฉัน

<LinearLayout
    android:gravity="center"
    >
    <TextView
        android:layout_gravity="center"
        />
    <Button
        android:layout_gravity="center"
        />
</LinearLayout>

ดังนั้นคุณจึงออกแบบ Linear Layout เพื่อวางเนื้อหาทั้งหมด (TextView และปุ่ม) ไว้ตรงกลางจากนั้น TextView และปุ่มจะถูกวางเทียบกับกึ่งกลางของ Linear Layout


1
ง่าย แอตทริบิวต์ 'แรงโน้มถ่วง' ส่งผลกระทบต่อเนื้อหาของมุมมอง ดังนั้นในกรณีนี้เนื้อหาของ LinearLayout คืออะไร? TextView และปุ่ม ผลที่ตามมาคือคุณกำลังสั่งให้ Layout Manager จัดศูนย์กลางเนื้อหาใด ๆ ของ Linear Layout
pcodex

2

android:gravity สามารถใช้กับเค้าโครงเพื่อจัดตำแหน่งลูกของมัน

android:layout_gravity สามารถใช้กับมุมมองใดก็ได้เพื่อจัดแนวตัวเองในพาเรนต์

หมายเหตุ: หากตัวเองหรือเด็กที่ไม่ได้อยู่ตรงกลางตามที่คาดไว้ตรวจสอบว่ามีความกว้าง / ความสูงmatch_parentและการเปลี่ยนแปลงไปเป็นอย่างอื่น

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.