Question

I need to build a layout similar to the following:

Desired layout

The three rows in the left are TextViews, whose total height is unknown at the beginning. The element in the right should be any widget that can change its background color dynamically. And it should span its height to fill the parent.

How can I achieve this? What widget should I use to display the color? And what layout?

I tried the following using a TextView for the right element, but it doesn't fill the parent.

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

<TextView 
    android:id="@+id/txtRow_color"
    android:layout_width="10dip"
    android:layout_height="fill_parent"
    android:layout_alignParentRight="true"  
    android:layout_alignParentTop="true"
    android:layout_alignParentBottom="true"
    android:background="#ff23cf"      
    android:text="" />

    <TextView
        android:id="@+id/txtRow_name"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_toLeftOf="@id/txtRow_color"
        android:textColor="#FFFF66"
        android:text="@string/nullstring" />

    <TextView
        android:id="@+id/txtRow_Tweet"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentBottom="true"
        android:layout_below="@id/txtRow_name"
        android:layout_toLeftOf="@id/txtRow_color"
        android:layout_alignWithParentIfMissing="true"
        android:gravity="center_vertical"
        android:text="@string/nullstring" />

</RelativeLayout>
Was it helpful?

Solution

can try

<?xml version="1.0" encoding="utf-8"?>

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

    <LinearLayout android:layout_width="0dp"
        android:layout_height="wrap_content" android:orientation="vertical"
        android:layout_weight=".8">
        <TextView android:id="@+id/te" android:layout_width="wrap_content"
            android:layout_height="wrap_content" android:text="Text1" />
        <TextView android:id="@+id/tile" android:layout_width="wrap_content"
            android:layout_height="wrap_content" android:text="Text2" />
        <TextView android:id="@+id/e" android:layout_width="wrap_content"
            android:layout_height="wrap_content" android:text="Text3" />

    </LinearLayout>

    <LinearLayout android:layout_width="0dp"
        android:layout_height="fill_parent" android:layout_weight=".2"
        android:background="@color/green">

    </LinearLayout>
</LinearLayout>

OTHER TIPS

You're probably going to have to use two nested LinearLayouts, something like this, I'll just stub it out with some of the important attributes:

<LinearLayout android:orientation= "horizontal">
  <LinearLayout android:orientation= "vertical" android:layout_height="fill_parent">
    <TextView android:layout_width="fill_parent" />
    <TextView android:layout_width="fill_parent" />
    <TextView android:layout_width="fill_parent" />
  </LinearLayout>
  <ImageView android:layout_height="fill_parent" />
</LinearLayout>

Since you're just displaying a solid color, there are a few other views that would work instead of the image view, this is just one example. You can use setBackgroundColor() on the ImageView to change it's color.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top