Monday, August 24, 2015

How to use ImageButton different image ScaleType in Android

activity_main.xml

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/rl"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="10dp"
    tools:context=".MainActivity"
    android:background="#b1b3a9"
    >
    <!--
        ImageView.ScaleType
            CENTER : Center the image in the view, but perform no scaling.
            CENTER_CROP : Scale the image uniformly (maintain the image's aspect
                          ratio) so that both dimensions (width and height) of the
                          image will be equal to or larger than the corresponding
                          dimension of the view (minus padding).
            FIT_XY : Scale the image using FILL.

            CENTER_INSIDE
            FIT_END
            FIT_START
            MATRIX
    -->
    <!-- ImageButton with default size, no scaling -->
    <ImageButton
        android:id="@+id/ib"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/image_button"
        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="No scaling"
        android:layout_below="@id/ib"
        />
    <!-- ImageButton scale type fit center by XML -->
    <ImageButton
        android:id="@+id/ib2"
        android:layout_width="175dp"
        android:layout_height="75dp"
        android:src="@drawable/image_button"
        android:layout_alignParentRight="true"
        android:scaleType="fitCenter"
        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Scale Type : fitCenter"
        android:layout_below="@id/ib2"
        android:layout_alignParentRight="true"
        />
    <!-- ImageButton scale type fit x y by XML -->
    <ImageButton
        android:id="@+id/ib3"
        android:layout_width="175dp"
        android:layout_height="75dp"
        android:src="@drawable/image_button"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:scaleType="fitXY"
        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Scale Type : fitXY"
        android:layout_toRightOf="@id/ib3"
        android:layout_alignBottom="@id/ib3"
        />
    <!-- ImageButton scaling programmatically in java code -->
    <ImageButton
        android:id="@+id/ib4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/image_button"
        android:layout_alignParentRight="true"
        android:layout_alignParentBottom="true"
        />
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Scale Type programmatically\nCENTER_CROP"
        android:layout_toStartOf="@id/ib4"
        android:layout_alignTop="@id/ib4"
        />
</RelativeLayout>
MainActivity.java

package com.cfsuman.me.androidcodesnippets;

import android.os.Bundle;
import android.app.Activity;
import android.widget.ImageButton;
import android.widget.ImageView;
import android.widget.RelativeLayout;


public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        // Get the widgets reference from XML layout
        final RelativeLayout rl = (RelativeLayout) findViewById(R.id.rl);
        final ImageButton ib = (ImageButton) findViewById(R.id.ib);
        final ImageButton ib2 = (ImageButton) findViewById(R.id.ib2);
        final ImageButton ib3 = (ImageButton) findViewById(R.id.ib3);
        final ImageButton ib4 = (ImageButton) findViewById(R.id.ib4);

        // Get the last ImageButton's layout parameters
        RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams) ib4.getLayoutParams();

        // Set the height of this ImageButton
        params.height = 150;

        // Set the width of that ImageButton
        params.width = 200;

        // Apply the updated layout parameters to last ImageButton
        ib4.setLayoutParams(params);

        // Set the ImageButton image scale type for fourth ImageButton
        ib4.setScaleType(ImageView.ScaleType.CENTER_CROP);
   }
}
More android examples