ShreeshaDas
ShreeshaDas

Reputation: 2042

How to split Linear Layout in to two columns?

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

Upvotes: 13

Views: 24044

Answers (3)

instanceof
instanceof

Reputation: 1466

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.

Upvotes: 0

Venkat
Venkat

Reputation: 3457

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);


}

Upvotes: 1

Matt Taylor
Matt Taylor

Reputation: 3408

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.

Upvotes: 8

Related Questions