堆棧內存溢出
  簡體   English   中英

水平布局，TextViews左右對齊

[英]Horizontal layout with TextViews aligned to left and right

 原文  2013-07-27 14:33:33  5   3    android/ android-layout

問題描述

我有以下視圖結構： 

------------------------------------
||------------||------------------||
||Text View 1 ||  Long Text View 3||
||------------||------------------||
||------------||------------------||
||Text 2      ||  View 4          ||
||------------||------------------||
------------------------------------

我想要以下行為：

  1. 左列與左側對齊
  2. 右列作為一組與右邊框對齊，但TextViews與左側對齊。
  3. 只要剩余足夠的空間用於其他列，列就會擴展並占用空間。
  4. 如果沒有足夠的空間來完全適合兩列，則水平空間被划分為1/2，文本視圖將換行。

我幾乎實現了這個，兩個垂直LinearLayouts嵌套在水平LinearLayout中。 但＃3並不滿足。 如果我為左右列設置權重= 1，即使有更多空間，它們最多占用50％。

如何實現所需的布局？

我已經在Android布局和其他答案的左右邊緣閱讀了對齊文本視圖 。 Relativelayout不起作用 - 在文本溢出的情況下，一列只與另一列重疊。 或者，如果我指定“toTheRightOf”，它首先完全離開列，然后嘗試適合右列，每行垂直文本使用單個字符。

我的xml： 

    <LinearLayout
            android:orientation="horizontal"
            android:layout_height="wrap_content"
            android:layout_width="match_parent">
        <LinearLayout
                android:id="@+id/leftTopPanel"
                android:orientation="vertical"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginRight="1dp"
                android:gravity="left"
                android:layout_weight="1">
            <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="very very very long text "
                    style="@style/InfoTextStyle.Big"
                    android:id="@+id/leftTopText"/>
            <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="text"
                    style="@style/InfoTextStyle"
                    android:id="@+id/leftTopText2"/>
        </LinearLayout>
        <LinearLayout
                android:id="@+id/rightTopPanel"
                android:orientation="vertical"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginLeft="1dp"
                android:layout_weight="1"
                android:gravity="right"
                >
            <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Also very very very long text"
                    style="@style/InfoTextStyle"
                    android:id="@+id/rightTopText"
                    android:layout_gravity="left"/>
            <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Shorter text"
                    style="@style/InfoTextStyle"
                    android:id="@+id/rightTopText2"
                    android:layout_gravity="left"/>
        </LinearLayout>
    </LinearLayout>

3 個解決方案

解決方案1
 1  2013-07-27 14:50:45

此代碼正在為您運行... 

<RelativeLayout 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"
tools:context=".MainActivity" >

<RelativeLayout
    android:id="@+id/Sperator"
    android:layout_width="1dp"
    android:layout_height="match_parent"
    android:layout_alignParentTop="true"
    android:layout_centerHorizontal="true" >

</RelativeLayout>

<RelativeLayout
    android:id="@+id/FirstLayout"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_alignParentTop="true"
    android:layout_toLeftOf="@id/Sperator" >

    <TextView
        android:id="@+id/tvFirstLabel"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:text="TextView"
        android:textSize="24sp" />

    <TextView
        android:id="@+id/tvFirstParagraph"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_below="@id/tvFirstLabel"
        android:text="ASFDNASKLCFNLASKFKLACNKJCUKENFIWOCNAMSKLDJAIUEFBN" />

</RelativeLayout>

<RelativeLayout
    android:id="@+id/SecondLayout"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentRight="true"
    android:layout_alignParentTop="true"
    android:layout_toRightOf="@id/Sperator" >

    <TextView
        android:id="@+id/tvSecondLabel"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:text="YourLongTextView"
        android:textSize="24sp" />

    <TextView
        android:id="@+id/tvSecondParagraph"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_below="@id/tvSecondLabel"
        android:text="ASFDNASKLsdfnjsacjsbnfsbfjhsbfjdsbfjhsbvfjhsbvfjbskCFNLASKFKLACNKJCUKENFIWOCNAMSKLDJAIUEFBN" />

</RelativeLayout>

ScreenShoot是;

在此輸入圖像描述

解決方案2
 1  2013-07-27 15:52:04

這是runnung ..請試試這個.. 

<RelativeLayout 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"
    tools:context=".MainActivity" >

    <RelativeLayout
            android:id="@+id/FirstLayout"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:minWidth="100dp" >

            <TextView
                    android:id="@+id/tvFirstLabel"
                    android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_alignParentTop="true"
            android:text="TextView"
            android:textSize="24sp" />

            <TextView
                    android:id="@+id/tvFirstParagraph"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentLeft="true"
                    android:layout_below="@id/tvFirstLabel"
                    android:text="fasfdsfsdfsdcvzxfasd" />

    </RelativeLayout>

    <RelativeLayout
            android:id="@+id/Sperator"
            android:layout_width="1dp"
            android:layout_height="match_parent"
            android:layout_alignParentTop="true"
            android:layout_toRightOf="@id/FirstLayout" >

    </RelativeLayout>

    <RelativeLayout
            android:id="@+id/SecondLayout"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_alignParentTop="true"
            android:layout_toRightOf="@id/Sperator"
            android:minWidth="100dp" >

            <TextView
                    android:id="@+id/tvSecondLabel"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentLeft="true"
                    android:layout_alignParentTop="true"
                    android:text="YourLongTextView"
                    android:textSize="24sp" />

            <TextView
                    android:id="@+id/tvSecondParagraph"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentLeft="true"
                    android:layout_below="@id/tvSecondLabel"
                    android:text="ASFDNASKLsdfnjsacjsbnfsbfjhsbfjdsbfjhsbvfjhsbvfjbskCFNLASKFKLACNKJCUKENFIWOCNAMSKLDJAIUEFBN" />

    </RelativeLayout>

</RelativeLayout>

我希望這對你有所幫助:)

解決方案3
 0  2013-07-27 18:45:22

好的，以下代碼適合我。 如果你想讓面板增長超過50％，請在兩個RelativeLayouts中用android:layout_width="wrap_content"替換android:layout_width="0dp" 。 

    <LinearLayout
            android:layout_height="wrap_content"
            android:layout_width="match_parent"
            android:id="@+id/relativeLayout">
        <RelativeLayout
                android:id="@+id/leftTopPanel"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:layout_marginRight="1dp">
            <LinearLayout android:layout_width="wrap_content"
                          android:layout_height="wrap_content"
                          android:orientation="vertical"
                          android:layout_alignParentLeft="true">
                <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="very very very very text "
                        style="@style/InfoTextStyle.Big"
                        android:id="@+id/leftTopText"/>
                <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="text"
                        style="@style/InfoTextStyle"
                        android:id="@+id/leftTopText2"/>
            </LinearLayout>
        </RelativeLayout>

        <RelativeLayout
                android:id="@+id/rightTopPanel"
                android:layout_width="0dp"
                android:layout_weight="1"
                android:layout_height="wrap_content">
            <LinearLayout android:layout_width="wrap_content"
                          android:layout_height="wrap_content"
                          android:orientation="vertical"
                          android:layout_alignParentRight="true">
                <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="long text"
                        style="@style/InfoTextStyle"
                        android:id="@+id/rightTopText"/>
                <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Shorter text"
                        style="@style/InfoTextStyle"
                        android:id="@+id/rightTopText2"/>
            </LinearLayout>
        </RelativeLayout>
    </LinearLayout>

暫無
暫無

聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

相關問題 在Android布局中對齊左側和右側邊緣的文本視圖 在線性布局的左側和右側對齊文本視圖？ 在中心周圍放置兩個文本視圖。 （左右對齊） 如何將兩個視圖放置在水平布局中，以便一個視圖與左側對齊，另一個視圖與右側對齊？ Android Layout 在水平布局中左右對齊 左右對齊文本視圖 wrap_content TextViews之間的layout_weight TextViews未對齊 項目從右到左排列，而不是從左到右排列 將多個文本視圖添加到水平線性布局 1個TextView中的左右對齊文本
相關標簽
 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM