Textview mit langen Text schiebt andere Ansichten außerhalb des Bildschirms

Question

Ich versuche, das folgende Layout zu erreichen:

+----------------------------------------+ 
| [icon] [text] [icon]     | 
+----------------------------------------+ 
| [icon] [very loooooooooooooooooo [icon]| 
|   oooooooooooooooong text]  | 
+----------------------------------------+ 

Wenn der Text kurz ist, wird das Symbol auf der rechten Seite muss direkt neben dem Text sein (nicht richtig ausgerichtet). Wenn der Text lang ist, muss der Text umbrochen werden.

Ich habe versucht, LinearLayout und RelativeLayout zu verwenden, aber die Symbole werden immer noch ausgeschoben, wenn ich einen langen Text habe. Hier sind die Layouts ich versucht habe:

Linearlayout:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:orientation="horizontal"> 

    <TextView 
     android:id="@+id/left" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="left"/> 

    <TextView 
     android:id="@+id/middle" 
     android:text="a long long string, a long long string, a long long string, a long long string, a long long string, a long long string, " 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:background="#D0E198"/> 

    <TextView 
     android:id="@+id/right" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="right"/> 
</LinearLayout> 

RelativeLayout:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content"> 

    <TextView 
     android:id="@+id/left" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="left"/> 

    <TextView 
     android:id="@+id/middle" 
     android:text="a long long string, a long long string, a long long string, a long long string, a long long string, a long long string, " 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:background="#D0E198" 
     android:layout_toRightOf="@id/left"/> 

    <TextView 
     android:id="@+id/right" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="right" 
     android:layout_toRightOf="@id/middle"/> 
</RelativeLayout> 

In beiden Fällen das richtige Symbol wird aus dem Bildschirm geschoben.

Ich habe auch LinearLayout mit layout_weight = "1" in der linken und rechten Ansicht und 0 in der mittleren Ansicht versucht. Das schiebt beide Symbole vom Bildschirm.

Answer 1

Verwenden Sie das erste Layout, aber fügen Sie Ihrer mittleren Textansicht eine Gewichtung hinzu.

Beispiel:

<TextView 
     android:id="@+id/middle" 
     android:text="a long long string, a long long string, a long long string, a long long string, a long long string, a long long string, " 
     android:layout_width="0dp" 
     android:layout_weight="1" 
     android:layout_height="wrap_content" 
     android:background="#D0E198"/> 

Stellen Sie sicher, 0DP als Ihre Breite zu verwenden!

Hinweis: Diese Antwort ist, wenn Sie möchten, dass das Symbol rechtsbündig ausgerichtet ist. Was, ich bin mir nicht sicher, dass du das brauchst.

Answer 2

Setzen Sie eine maxWidth auf das Textfeld. Es wird nicht größer werden. Sie können maxLines auch so einstellen, dass das Umbrechen auf eine neue Zeile gestoppt wird.

Answer 3

können Sie überprüfen:

(Mitte:

android:layout_toLeftOf="@+id/right" 
     android:layout_toRightOf="@+id/left" 

)

(rechts: android:layout_alignParentRight="true")

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content"> 

    <TextView 
     android:id="@+id/left" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="left"/> 

    <TextView 
     android:id="@+id/middle" 
     android:text=" a long long string, a long long string, a long long string, a long long string, a long long string, a long long string, " 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:background="#D0E198" 
     android:layout_centerInParent="true" 
     android:layout_toLeftOf="@+id/right" 
     android:layout_toRightOf="@+id/left"/> 

    <TextView 
     android:id="@+id/right" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="right" 
     android:layout_alignParentRight="true" 
     /> 
</RelativeLayout> 

Answer 4

Hier ist, was ich getan habe, zu erreichen, was ich will :

Ich habe layout_weight = „1“ zum Mitte Textview

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       android:orientation="horizontal"> 

    <TextView 
     android:id="@+id/left" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="left"/> 

    <WrapWidthTextView 
     android:id="@+id/middle" 
     android:text="a long long string, a long long string, a long long string, a long long string, a long long string, a long long string, " 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:background="#D0E198" 
     android:layout_weight="1"/> 

    <TextView 
     android:id="@+id/right" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:text="right"/> 
</LinearLayout> 

Wenn jedoch der mittlere Text kurz ist, wird es noch den gesamten leeren mittleren Raum einnehmen und schiebt den rechten Textview den ganzen Weg auf der rechten Seite. Ich habe Textview Unterklasse:

public class WrapWidthTextView 
    extends TextView { 

    // constructors here 

    @Override protected void onMeasure (final int widthMeasureSpec, final int heightMeasureSpec) { 
     super.onMeasure (widthMeasureSpec, heightMeasureSpec); 

     Layout layout = getLayout(); 
     if (layout != null) { 
      int width = (int) Math.ceil (getMaxLineWidth (layout)) 
         + getCompoundPaddingLeft() + getCompoundPaddingRight(); 
      int height = getMeasuredHeight(); 
      setMeasuredDimension (width, height); 
     } 
    } 

    private float getMaxLineWidth (Layout layout) { 
     float max_width = 0.0f; 
     int lines = layout.getLineCount(); 
     for (int i = 0; i < lines; i++) { 
      if (layout.getLineWidth (i) > max_width) { 
       max_width = layout.getLineWidth (i); 
      } 
     } 
     return max_width; 
    } 
} 

Mit WrapWidthTextView, wenn der Text kurz ist, wird es die Ansicht verkleinern, den Text zu passen.

Und das löste mein Problem. Ich hoffe, dass dies auch anderen hilft.

Answer 5

Sie können auf this verweisen; Zuerst legen Sie das erste linke Icon, , dann verwenden Sie die Referenzmethode zum Layout [Textansicht und rechts Icon];

Es funktioniert absolut!

Natürlich Entsprechend Ihrer Anforderung, die letzte rechte Symbol kann als das mittlere Textview DrawableRight gesetzt. Aber diese Methode hat eine Einschränkung: Das rechte Symbol hat Begrenzungen an die Textansicht gebunden.

Answer 6

Nach einigen Haaren ziehen und ohne ersichtliche sollution ich zu diesem Hack kam. Die benutzerdefinierte Textansichtsklasse funktioniert nur für Textansichten und ich musste sie für ein Layout mit mehreren Dingen verwenden. Einschränkung davon ist, dass Sie die maximale Breite für das richtige Element definiert haben müssen. Das erinnert mich ein wenig an die alten HTML IE 6 Tage ..

<RelativeLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content"> 

     <FrameLayout 
      android:id="@+id/resizing_element" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:paddingRight="112dp" // Right padding to the amount of space you need for the right element 
      android:background="@drawable/bg_chat_in" // Background drawable has the same transparant padding added to complete the illusion of this hack 
      android:text="Long text content" /> 

     <FrameLayout 
      android:id="@+id/meta_container" 
      android:layout_width="112db" // This one has to have a predefined size. 
      android:layout_height="wrap_content" 
      android:layout_alignRight="@+id/content_container" // Align right places this element in the right padding of the first element> 

     </FrameLayout> 

    </RelativeLayout>