CODEWITHSUNDEEP
androidandroid-layout
antanas_sepikas
antanas_sepikas

Reputation: 5714

Android buttons equal width

I need to have 2 buttons which wrap content but always stay same equal in width.

enter image description here

I want BUTTON 1 stretch to the width of BUTTON 2. Or if BUTTON 1 Would be wider I would need BUTTON 2 to stretch to the width of BUTTON 1

enter image description here

How can I achieve this? I tried using LinearLayout with weights, but it only works if linear layout width matched parent, which makes buttons unnecessary wide.

Upvotes: 5

Views: 2896

Answers (5)

Jantar88
Jantar88

Reputation: 164

I'm answering an old question, but there exist a one line solution.

Add android:layout_width="0dip" to both (i.e. all) buttons definitions in .xml file.

Another (alternative) solution is to add android:layout_width="fill_parent" to both (all) buttons definitions.

Upvotes: 0

Palak Darji
Palak Darji

Reputation: 1114

While Ajay's answer is right, but it requires you to remove the listener once you are done with it.

ViewTreeObserver vto2 = button2.getViewTreeObserver();
vto2 .addOnGlobalLayoutListener(new OnGlobalLayoutListener() {
    @Override
    public void onGlobalLayout() {

        width = button2.getWidth();
        height = button2.getHeight();

        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN) {
            myView.getViewTreeObserver().removeOnGlobalLayoutListener(this);
        }
        else {
            myView.getViewTreeObserver().removeGlobalOnLayoutListener(this);
        }
    }
});

Upvotes: 2

Anuj Kumar
Anuj Kumar

Reputation: 1162

Use Linear Layout Weight Attribute First Enclose Both Buttons In Linear Layout And give them horizontal orientation. Then Give Them Equal Weights

android:layout_weight="1"

Try This Result

Upvotes: 4

Arnold Brown
Arnold Brown

Reputation: 1433

Try this!!! This may help...

<LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:weightSum="2">

            <Button
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="Button 1"/>

            <Button
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="Button 2"/>
    </LinearLayout>

This will give the output as,

enter image description here

Upvotes: 3

Aj 27
Aj 27

Reputation: 2427

To make both the button identical you have to calculate width of both the button like this

ViewTreeObserver vto1 = button1.getViewTreeObserver();
vto1.addOnGlobalLayoutListener(new OnGlobalLayoutListener() {
    @Override
    public void onGlobalLayout() {

        width = button1.getWidth();
        height = button1.getHeight();
    }
});

ViewTreeObserver vto2 = button2.getViewTreeObserver();
vto2 .addOnGlobalLayoutListener(new OnGlobalLayoutListener() {
    @Override
    public void onGlobalLayout() {

        width = button2.getWidth();
        height = button2.getHeight();
    }
});

then compare both the button height and set the larger one to both the buttons.

Upvotes: 2

Related Questions