Question with the design of text in the text: two text fields, side by side, with different layout alignments and weights

I'm still a bit of Android noob, goodbye if it's simple and I just don't see it.

There are two parts of the text in the view that cover the entire width horizontally, but reach only one line of text. The left side should always be displayed in full, but should not occupy more horizontal space than necessary. Move the right side with the left side and fill the rest of the screen width. If the text on the right side is smaller than this width, the text should be horizontally aligned to the right. If the text is larger than the width, it should scroll horizontally.

The text on the right side will be updated frequently and should be displayed with new text when the application reports this (explaining TextSwitcher in the layout).

I tried two different layout styles. In both situations, I can make the left side β€œclick” the layout, on the right side I can scroll, but I can’t figure out how to choose the right side. It always aligns to the left. Here is a picture showing what is happening ...

http://img10.imageshack.us/img10/5599/androidlayout.png

Also (but less important), in my layout code, I have android: fadingEdge = "none" in TextViews, but when I scroll it, it still has a faded edge on the left and right. Why is this?

Here are two layouts I created that produce results, but not the results that I want.

Using Horizontal LinearLayout ...

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/LinearLayoutStatusBar" android:orientation="horizontal" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_margin="2px" android:background="#555555" > <TextView android:id="@+id/TextViewTimer" android:textSize="18px" android:textColor="#FFFFFF" android:layout_gravity="left" android:layout_weight="0" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="0px" android:layout_marginRight="3px" android:text="Left Side" > </TextView> <TextSwitcher android:id="@+id/TextSwitcherDetails" android:inAnimation="@anim/push_up_in" android:outAnimation="@anim/push_up_out" android:layout_weight="1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="right" android:layout_marginLeft="3px" android:layout_marginRight="0px" > <TextView android:id="@+id/TextViewDetails1" android:textSize="18px" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_gravity="right" android:singleLine="true" android:ellipsize="marquee" android:marqueeRepeatLimit="marquee_forever" android:scrollHorizontally="true" android:focusable="true" android:focusableInTouchMode="true" android:fadingEdge="none" android:text="Right Side 1" > </TextView> <TextView android:id="@+id/TextViewDetails2" android:textSize="18px" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_gravity="right" android:singleLine="true" android:ellipsize="marquee" android:marqueeRepeatLimit="marquee_forever" android:scrollHorizontally="true" android:focusable="true" android:focusableInTouchMode="true" android:fadingEdge="none" android:text="Right Side 2 - This is a really long text this is long and fun and fun and long" > </TextView> </TextSwitcher> </LinearLayout> 

So, how do I get this text on the right side for right alignment. Thanks!


EDIT:

I found a problem ... There were several errors. First, I discovered the difference between gravity and layout_gravity. I needed to use gravity to align the text to the right.

I can not add any links, so copy and paste the link below

thinkandroid.wordpress.com/2010/01/14/how-to-position-views-properly-in-layouts/

However, this did not give me exactly the layout I wanted, because long lines of text would be right-aligned before scrolling, and the front of the message could not be read until it moved around. What I needed to do was use three β€œcolumns” of views, while the weight in the middle (empty) view should be β€œ1” and the rest β€œ0”, so that it would bring the text as close as possible to the largest text on the right, preserving at this is left alignment.

Further, I found that the width of the TextSwitcher is the same as the width of the TextView. This is a problem when switching from a long row to a short row using setText (), because the middle column will not push the small text to the edge. The solution is to use two setText () s. One to trigger the fade out animation, and then click runnable to start after the animation to set the text again to trigger a newline animation.

Now my only problem is that when the fade-out animation runs on a long line of text, if it is in the middle of scrolling, it is reset to position X = 0 before fading, so the effect is that it scrolls, jumps to the original position then disappears. Does anyone know how to fix this?

(I removed the RelativeLayout code above because it was wrong, as this post is really long.)

Here is the working layout code ...

 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/LinearLayoutStatusBar" android:orientation="horizontal" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="2px" android:background="#333333" > <TextView android:id="@+id/TextViewTimer" android:textSize="18px" android:textColor="#FFFFFF" android:layout_gravity="top" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="0" android:layout_marginLeft="1px" android:layout_marginRight="4px" android:text="Left Side" > </TextView> <View android:id="@+id/ViewSpacer" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="1" ></View> <TextSwitcher android:id="@+id/TextSwitcherDetails" android:inAnimation="@anim/push_up_in" android:outAnimation="@anim/push_up_out" android:layout_gravity="top" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="0" android:layout_marginRight="1px" > <TextView android:id="@+id/TextViewDetails1" android:textSize="18px" android:layout_width="wrap_content" android:layout_height="wrap_content" android:singleLine="true" android:ellipsize="marquee" android:marqueeRepeatLimit="marquee_forever" android:scrollHorizontally="true" android:focusable="true" android:focusableInTouchMode="true" android:fadingEdge="none" > </TextView> <TextView android:id="@+id/TextViewDetails2" android:textSize="18px" android:layout_width="wrap_content" android:layout_height="wrap_content" android:singleLine="true" android:ellipsize="marquee" android:marqueeRepeatLimit="marquee_forever" android:scrollHorizontally="true" android:focusable="true" android:focusableInTouchMode="true" android:fadingEdge="none" > </TextView> </TextSwitcher> </LinearLayout> 
+7
source share
1 answer

I found a problem! There were a few mistakes. First, I discovered the difference between gravity and layout_gravity. I needed to use gravity to align the text to the right.

http://thinkandroid.wordpress.com/2010/01/14/how-to-position-views-properly-in-layouts/

However, this did not give me exactly the layout I wanted, because long lines of text would be right-aligned before scrolling, and the front of the message could not be read until it moved around. What I needed to do was use three β€œcolumns” of views, while the weight in the middle (empty) view should be β€œ1” and the rest β€œ0”, so that it would bring the text as close as possible to the largest text on the right, preserving at this is left alignment.

Further, I found that the width of the TextSwitcher is the same as the width of the TextView. This is a problem when switching from a long row to a short row using setText (), because the middle column will not push the small text to the edge. The solution is to use two setText () s. One to trigger the fade out animation, and then click runnable to start after the animation to set the text again to trigger a newline animation.

Unfortunately, horizontal scrolling of the text looks awful when the text switches every five to ten seconds. So I just let him run away from the screen.

+4
source

All Articles