13

I have to split a Single Linear layout into a Two Columns(Like newspaper Columns).The linear layout contain text-view and image-view

I have taken the screen width and have divided it to half and made the TextView and ImageView to come in a first column , ie, A B C blocks in the picture below.. now the remaining TextView and 'ImageView has to go to next column like in D E F like that it goes on.So it would be helpful if anyone gives me any code or ideas to implement this.. I tried with GridView which is not suitable for my issue. Since the TextView and ImageView sizes are not definite.

enter image description here

I don't know how to split Liner layout. I tried with calculating the rootlayout height like this

linearLayout.post(new Runnable() {

            @Override
            public void run() {
                // TODO Auto-generated method stub
                int linsize=linearLayout.getHeight();
                int relsize=root.getHeight();
                int textsize=txt1.getHeight();
                mainheight=relsize;
                subheight=linsize;
                Toast.makeText(getApplicationContext(), "Linerlayout "+linsize, Toast.LENGTH_LONG).show();
                Toast.makeText(getApplicationContext(), "Relative layout"+relsize, Toast.LENGTH_LONG).show();
                Toast.makeText(getApplicationContext(), "text height "+textsize, Toast.LENGTH_LONG).show();

                if(mainheight==subheight)
                {
                    Toast.makeText(getApplicationContext(), "make a new linear layout", Toast.LENGTH_LONG).show();
                    createsubview();
                }
            }
        }); 

Screenshot

enter image description here

9
  • Adaptive Ui - You can refer - developer.android.com/training/multiscreen/adaptui.html
    – Anukool
    Mar 7, 2013 at 11:09
  • Why not use a RelativeLayout which automatically does the same?
    – Nezam
    Mar 7, 2013 at 11:11
  • Will you share a demo video link or app screenshot example ? Mar 7, 2013 at 11:11
  • @Nezam how can achieve this by Relative Layout Mar 7, 2013 at 11:35
  • 1
    yes you can load huge text in to webview but what about images comes b/w Text Apr 29, 2013 at 12:48

3 Answers 3

8

You could easily do this with nested LinearLayouts:

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

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:orientation="vertical" >

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@drawable/item" />

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

        </LinearLayout>

        <LinearLayout
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:orientation="vertical" >

            <ImageView
                content here/>

            <TextView
                content here/>

        </LinearLayout>
    </LinearLayout>

Then all that you need to do is put A, B and C in the first vertical layout, and D, E and F in the second.

1
  • With all due respect, may I ask why? Android's XML layout is there for your benefit, and is part of their design guidelines. Alternatively, if there's a specific reason for not using XML, it's really easy to define exactly the same above layout in code, setting the weights and placement manually Mar 7, 2013 at 11:58
1

You can't do it with GridView. You would have to create a custom view to do this.

if you know how big your grid items are, you can cut some corners. GridView is complicated mostly because it deals with items of any size and loads them dynamically. An easier way for you might be:

1.Create a HorizontalScrollView with a horizontal LinearLayout inside.

2.Determining how many rows of your item will fit on the screen. Call this rows.

3.while you still have items you need to layout:

    1.Create a vertical LinearLayout, adding rows or less items to it.
    2.Add your new vertical LinearLayout to the horizontal one.

There are some downsides versus what a "horizontal GridView" would get you:

1.All the views are loaded up immediately, which is bad for huge lists of items.
2.You need to know how big your items are, and they need to be the same size.

Upsides:

1.It's very easy to implement.

for more inf plz see this link

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    ScrollView scrollView = new ScrollView(this);//ScrollView
    LinearLayout ll = new LinearLayout(this); //root LinearLayout
    ll.setOrientation(LinearLayout.HORIZONTAL);//with horizontal orientation
    LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT,1f);
    LinearLayout l2 = new LinearLayout(this); //sub linearlayout
    l2.setOrientation(LinearLayout.VERTICAL);//with vertical orientation
    l2.setLayoutParams(layoutParams);
    LinearLayout l3 = new LinearLayout(this); //sub linearlayout
    l3.setOrientation(LinearLayout.VERTICAL);//with vertical orientation
    l3.setLayoutParams(layoutParams);
    int totalvalues=41;     //i take count as 41
    for(int i=0;i<totalvalues;i++){  // add the buttons in the layout based on condition
        Button okButton=new Button(this);
        okButton.setText("Button"+i);
        if(i<=totalvalues/2){
        l2.addView(okButton);
        }
        else{
        l3.addView(okButton);   
        }
    }
    ll.addView(l2);   //add sub linearlayout to root linearlayout
    ll.addView(l3);  //add sub linearlayout to root linearlayout

    scrollView.addView(ll); //add the root linearlayout to scrollview

    setContentView(scrollView);


}
3
  • 1
    bro my question is how can i know how to place 6 item in left and remaining in right Mar 8, 2013 at 4:08
  • 1
    yes you are saying correct but you are dividing the view by manually.So i want fill the view diagrammatically means while adding sub-view i should check is their a space to add. Mar 8, 2013 at 7:19
  • 1
    you are dividing contents by numbers like totalvalues/2.But in my case i have to divide content by screen size(If view is reached to bottom of screen) then i have to create a view in right side. Mar 8, 2013 at 9:19
0

Have you tried:

DisplayMetrics metrics = getResources().getDisplayMetrics();
float dpW = 0f;
int pixelsW = (int) (metrics.density * dpW + 0.5f);
TableLayout.LayoutParams lp = new TableLayout.LayoutParams(pixelsW, LayoutParams.WRAP_CONTENT, 1f);
TextView txt = new TextView(MainActivity.this);
ImageView img = new ImageView(MainActivity.this);
txt.setLayoutParams(lp);
img.setLayoutParams(lp);

Using TableLayout's LayoutParams, you can set the weight of the view, which, as you know, must be 1. We also use DisplayMetrics to convert a float into the "dp" format used in xml.

EDIT:

You can also set this LayoutParams to a LinearLayout.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.