CODEWITHSUNDEEP
androidandroid-layoutscaleandroid-imagebuttonandroid-layout-weight
Flo
Flo

Reputation: 1207

How can I do scale the buttonsheight?

I want to get 3 ImageButtons in one row with the same size.

I want something this like:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@color/black"
    android:orientation="vertical"
    android:paddingBottom="40dp"
    android:paddingTop="40dp" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal|fill_horizontal|center"
        android:gravity="fill_horizontal" >

        <LinearLayout
            android:id="@+id/dummy_005"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:orientation="horizontal" >
        </LinearLayout>

        <ImageButton
            android:id="@+id/button_scan"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="3"
            android:background="@drawable/image_button"
            android:focusableInTouchMode="true"
            android:scaleType="fitCenter"
            android:
            android:src="@drawable/scan_symbol" />

        <LinearLayout
            android:id="@+id/dummy_002"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:orientation="horizontal" >

        </LinearLayout>

        <ImageButton
            android:id="@+id/button_hitsorie"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="3"
            android:background="@drawable/image_button"
            android:src="@drawable/historie_symbol" />

        <LinearLayout
            android:id="@+id/dummy_003"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:orientation="horizontal" >
        </LinearLayout>

        <ImageButton
            android:id="@+id/button_2"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="3"
            android:background="@drawable/image_button" />

        <LinearLayout
            android:id="@+id/dummy_004"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:orientation="horizontal" >

        </LinearLayout>

    </LinearLayout>

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

        <TextView
            android:id="@+id/textView_result"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:textSize="@dimen/testTextSize" />

    </LinearLayout>
</LinearLayout>

I want the button to be quadtra (width == height). But the width is 0dp with weight: 3. But how can I do that the buttonsheight will be scaled?

Upvotes: 0

Views: 591

Answers (3)

raji ramamoorthi
raji ramamoorthi

Reputation: 443

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <ImageButton
        android:id="@+id/imageButton1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/abc_ab_bottom_solid_dark_holo" />

    <ImageButton
        android:id="@+id/imageButton2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:src="@drawable/abc_ab_bottom_solid_dark_holo" />

    <ImageButton
        android:id="@+id/imageButton3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:src="@drawable/abc_ab_bottom_solid_dark_holo" />

</RelativeLayout>

Upvotes: 1

speedynomads
speedynomads

Reputation: 2682

You need to subclass the ImageButton class and set tell it to apply the widthMeasureSpec to both the width and height.

    public class SquareImageButton extends ImageButton {

    public SquareImageButton(Context context) {
        this(context, null);
    }

    public SquareImageButton(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public SquareImageButton(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, widthMeasureSpec);
    }
}

Then in your layout do something like this, obviously replacing the package name with the location of your custom view...

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">

<com.example.domji84.quadtraimagebuttons.SquareImageButton
    android:layout_width="0dp"
    android:layout_height="match_parent"
    android:layout_weight="1"/>

<com.example.domji84.quadtraimagebuttons.SquareImageButton
    android:layout_width="0dp"
    android:layout_height="match_parent"
    android:layout_weight="1"/>

<com.example.domji84.quadtraimagebuttons.SquareImageButton
    android:layout_width="0dp"
    android:layout_height="match_parent"
    android:layout_weight="1"/>

</LinearLayout>

This will always set the height of your custom ImageButton to match its width when rendered on screen.

Be aware that this will not inherit the system theme styles, although there is a way of setting this in the custom view, it's better to choose your own styles and set a background color, image, text, selectors and anything else you need...

Upvotes: 2

RajeshVijayakumar
RajeshVijayakumar

Reputation: 10640

I hope this will help you,

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:weightSum="3" >

<ImageButton
    android:id="@+id/button_1"
    android:layout_width="80dp"
    android:layout_height="80dp"
    android:layout_weight="1"
    android:background="@android:drawable/btn_default" />

 <ImageButton
    android:id="@+id/button_2"
    android:layout_width="80dp"
    android:layout_height="80dp"
    android:layout_weight="1"
    android:background="@android:drawable/btn_default" />
  <ImageButton
    android:id="@+id/button_3"
    android:layout_width="80dp"
    android:layout_height="80dp"
    android:layout_weight="1"
    android:background="@android:drawable/btn_default" />
  </LinearLayout>

Upvotes: 1

Related Questions