Modify the Views of RelativeLayout in XML through CODE


right

We have developed the above layout using the following xml code:

1:  <RelativeLayout  
2:      android:id="@id/productHeader"  
3:      android:layout_width="wrap_content"  
4:      android:layout_height="wrap_content"  
5:      android:layout_below="@id/whiteView"  
6:      android:background="@drawable/product_detail_item_bg"  
7:      android:paddingBottom="5dp"  
8:      android:paddingLeft="14dp"  
9:      android:paddingRight="14dp"  
10:      android:paddingTop="5dp" >  
11:    
12:      <LinearLayout  
13:        android:id="@id/productMainImage"  
14:        android:layout_width="wrap_content"  
15:        android:layout_height="wrap_content"  
16:        android:layout_alignParentRight="true"  
17:        android:orientation="vertical"  
18:        android:paddingBottom="5dp"  
19:        android:paddingLeft="14dp"  
20:        android:paddingRight="14dp"  
21:        android:paddingTop="5dp" >  
22:    
23:        <ImageView  
24:          android:id="@id/primaryImageProduct"  
25:          android:layout_width="wrap_content"  
26:          android:layout_height="wrap_content"  
27:          android:layout_marginBottom="8dp"  
28:          android:src="@drawable/ic_launcher_icon" />  
29:    
30:        <TextView  
31:          android:id="@id/productMainImageTitle"  
32:          style="@style/SubTitleBold"  
33:          android:layout_width="wrap_content"  
34:          android:layout_height="wrap_content"  
35:          android:text="Exhibitor"  
36:          android:textSize="12sp" />  
37:      </LinearLayout>  
38:    
39:      <RelativeLayout  
40:        android:id="@+id/productInfoLayout"  
41:        android:layout_width="wrap_content"  
42:        android:layout_height="wrap_content"  
43:        android:layout_alignParentLeft="true"  
44:        android:layout_alignParentTop="true" >  
45:    
46:        <TextView  
47:          android:id="@id/productTitle"  
48:          style="@style/ListTextStyleHeading"  
49:          android:layout_width="wrap_content"  
50:          android:layout_height="wrap_content"  
51:          android:text="Samsung Galaxy SII"  
52:          android:textSize="14dp" />  
53:    
54:        <TextView  
55:          android:id="@id/productPriceLabel"  
56:          style="@style/SubTitleBold"  
57:          android:layout_width="wrap_content"  
58:          android:layout_height="wrap_content"  
59:          android:layout_below="@id/productTitle"  
60:          android:text="Price: " />  
61:    
62:        <TextView  
63:          android:id="@id/productPriceValue"  
64:          style="@style/SubTitleBold"  
65:          android:layout_width="wrap_content"  
66:          android:layout_height="wrap_content"  
67:          android:layout_below="@id/productTitle"  
68:          android:layout_toRightOf="@id/productPriceLabel"  
69:          android:text="Rs.199" />  
70:    
71:        <TextView  
72:          android:id="@id/productStallLabel"  
73:          style="@style/SubTitleBold"  
74:          android:layout_width="wrap_content"  
75:          android:layout_height="wrap_content"  
76:          android:layout_below="@id/productPriceLabel"  
77:          android:text="Stall No: " />  
78:    
79:        <TextView  
80:          android:id="@id/productStallValue"  
81:          style="@style/SubTitleBold"  
82:          android:layout_width="wrap_content"  
83:          android:layout_height="wrap_content"  
84:          android:layout_below="@id/productPriceValue"  
85:          android:layout_toRightOf="@id/productStallLabel"  
86:          android:text="# 201" />  
87:    
88:        <RatingBar  
89:          android:id="@id/productRatingBar"  
90:          style="@style/starRatingBar"  
91:          android:layout_width="wrap_content"  
92:          android:layout_height="wrap_content"  
93:          android:layout_below="@id/productStallLabel"  
94:          android:layout_marginBottom="8dp"  
95:          android:layout_marginTop="2dp"  
96:          android:numStars="5"  
97:          android:stepSize="1.0" />  
98:      </RelativeLayout>  
99:    </RelativeLayout>  

 

We have another class which can use the same layout. But with slight modification. The image must be at the right hand side of the  screen and the details must be at the left hand side of the screen . The modified layout must look as follows:
left

It would be very ineffective if we create another layout file for such a small purpose. We can change our layout dynamically through codes. The given code snippet will switch the position of the view

1:    
2:      Boolean layoutNeedsModification = true;  
3:           LinearLayout productMainImage = (LinearLayout) viewGroup  
4:                                      .findViewById(R.id.productMainImage);  
5:           RelativeLayout productInfoLayout = (RelativeLayout) viewGroup  
6:                                      .findViewById(R.id.productInfoLayout);  
7:    
8:    
9:       if (layoutNeedsModification) {  
10:                             RelativeLayout.LayoutParams params = new           RelativeLayout.LayoutParams(  
11:                                               RelativeLayout.LayoutParams.WRAP_CONTENT,  
12:                                               RelativeLayout.LayoutParams.WRAP_CONTENT);  
13:                             params.addRule(RelativeLayout.ALIGN_PARENT_LEFT,  
14:                                               RelativeLayout.TRUE);  
15:    
16:                             productMainImage.setLayoutParams(params);  
17:    
18:                             params = new RelativeLayout.LayoutParams(  
19:                                               RelativeLayout.LayoutParams.WRAP_CONTENT,  
20:                                               RelativeLayout.LayoutParams.WRAP_CONTENT);  
21:                             params.addRule(RelativeLayout.ALIGN_PARENT_RIGHT,  
22:                                               RelativeLayout.TRUE);  
23:    
24:                             productInfoLayout.setLayoutParams(params);  
25:    
26:                    }  

 

As you can see, this is what you have to do:

  1. Create a RelativeLayout.LayoutParams object.
  2. Use addRule(int) or addRule(int, int) to set the rules. The first method is used to add rules that don’t require values.
  3. Set the parameters to the view (in this case, to each button).

References:
Reference No. 1

About these ads

, , , , , ,

  1. Leave a comment

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Follow

Get every new post delivered to your Inbox.

Join 69 other followers

%d bloggers like this: