CODEWITHSUNDEEP
androidandroid-layout
Yogus
Yogus

Reputation: 2272

Scale the images to fill the screen in relative layout

I am very new to Android layouts. Could you please help me scale teh images to cover width and height of the white space.

Here is the screen.

its all tilted to right side. how can I make it to fill the screen

here is the layout

<?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="vertical"

    >

      <RelativeLayout
          android:id="@+id/jkmenu1"
          android:layout_width="match_parent"
          android:layout_height="match_parent" >

          <ImageButton
              android:id="@+id/atm"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:layout_alignBottom="@+id/airport"
              android:layout_alignLeft="@+id/birthday"
              android:background="@android:color/transparent"
              android:src="@drawable/atm" />

          <ImageButton
              android:id="@+id/currency"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:layout_alignLeft="@+id/birthday"
              android:layout_alignTop="@+id/classifieds"
              android:src="@drawable/currency"
              android:background="@android:color/transparent" />

          <ImageButton
              android:id="@+id/education"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:layout_alignParentRight="true"
              android:layout_below="@+id/coffee"
              android:background="@android:color/transparent"
              android:src="@drawable/education" />

          <ImageButton
              android:id="@+id/coffee"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:layout_alignParentRight="true"
              android:layout_below="@+id/bar"
              android:background="@android:color/transparent"
              android:src="@drawable/coffee" />

          <ImageButton
              android:id="@+id/bar"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:layout_above="@+id/birthday"
              android:layout_alignParentRight="true"
              android:background="@android:color/transparent"
              android:src="@drawable/bar" />

          <ImageButton
              android:id="@+id/birthday"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:layout_below="@+id/atm"
              android:layout_toLeftOf="@+id/coffee"
              android:background="@android:color/transparent"
              android:src="@drawable/bithday" />

          <ImageButton
              android:id="@+id/beauty"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:layout_centerVertical="true"
              android:layout_toLeftOf="@+id/atm"
              android:background="@android:color/transparent"
              android:src="@drawable/beauty" />

          <ImageButton
              android:id="@+id/airport"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:layout_above="@+id/beauty"
              android:layout_alignLeft="@+id/beauty"
              android:background="@android:color/transparent"
              android:src="@drawable/airport" />

          <ImageButton
              android:id="@+id/classifieds"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:layout_alignLeft="@+id/beauty"
              android:layout_alignTop="@+id/education"
              android:background="@android:color/transparent"
              android:src="@drawable/classifieds" />

      </RelativeLayout>

</LinearLayout>

Thank you all guys

SOlution for adding space is

I added 

<View android:layout_height="60sp"/>

on the upper code side which gave me space :) to put my other things on the screen.

Upvotes: 0

Views: 1791

Answers (4)

Homam
Homam

Reputation: 5076

Use like this. This will do exactly what you are looking for.

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_gravity="center"
    android:stretchColumns="*" >

    <TableRow
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:layout_weight="1" >

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:src="@drawable/ic_launcher" />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:src="@drawable/ic_launcher" />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:src="@drawable/ic_launcher" />
    </TableRow>

    <TableRow
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:layout_weight="1" >

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:src="@drawable/ic_launcher" />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:src="@drawable/ic_launcher" />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:src="@drawable/ic_launcher" />
    </TableRow>

    <TableRow
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:layout_weight="1" >

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:src="@drawable/ic_launcher" />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:src="@drawable/ic_launcher" />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:src="@drawable/ic_launcher" />
    </TableRow>

</TableLayout>

Upvotes: 0

Fl&#225;vio Faria
Fl&#225;vio Faria

Reputation: 6605

Consider using TableLayout or GridLayout.

There are many examples on the web, check these out:

Android TableLayout Example
Android Sdk TableLayout
GridLayout in Android

Upvotes: 0

Sankar V
Sankar V

Reputation: 4862

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/jkmenu1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:orientation="horizontal" >
        <ImageButton
            android:id="@+id/atm"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@android:color/transparent"
            android:src="@drawable/ic_launcher" >
        </ImageButton>
        <ImageButton
            android:id="@+id/currency"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@android:color/transparent"
            android:src="@drawable/ic_launcher" />
        <ImageButton
            android:id="@+id/education"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@android:color/transparent"
            android:src="@drawable/ic_launcher" />
    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:orientation="horizontal" >
        <ImageButton
            android:id="@+id/coffee"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@android:color/transparent"
            android:src="@drawable/ic_launcher" />
        <ImageButton
            android:id="@+id/bar"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@android:color/transparent"
            android:src="@drawable/ic_launcher" />
        <ImageButton
            android:id="@+id/birthday"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@android:color/transparent"
            android:src="@drawable/ic_launcher" />
    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:orientation="horizontal" >
        <ImageButton
            android:id="@+id/beauty"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@android:color/transparent"
            android:src="@drawable/ic_launcher" />
        <ImageButton
            android:id="@+id/airport"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@android:color/transparent"
            android:src="@drawable/ic_launcher" />
        <ImageButton
            android:id="@+id/classifieds"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:background="@android:color/transparent"
            android:src="@drawable/ic_launcher" />
    </LinearLayout>
</LinearLayout>

Upvotes: 2

Triode
Triode

Reputation: 11357

<?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:background="@android:color/black"
    android:orientation="vertical"
    android:weightSum="3" >

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:orientation="horizontal"
        android:weightSum="3" >

        <ImageButton
            android:id="@+id/atm"
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:layout_alignBottom="@+id/airport"
            android:layout_alignLeft="@+id/birthday"
            android:layout_weight="1"
            android:background="@android:color/transparent"
            android:src="@drawable/ic_action_search" />

        <ImageButton
            android:id="@+id/currency"
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:layout_alignLeft="@+id/birthday"
            android:layout_alignTop="@+id/classifieds"
            android:layout_weight="1"
            android:background="@android:color/transparent"
            android:src="@drawable/ic_launcher" />

        <ImageButton
            android:id="@+id/classifieds"
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:layout_alignLeft="@+id/beauty"
            android:layout_alignTop="@+id/education"
            android:layout_weight="1"
            android:background="@android:color/transparent"
            android:src="@drawable/ic_action_search" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:orientation="horizontal" >

        <ImageButton
            android:id="@+id/bar"
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:layout_above="@+id/birthday"
            android:layout_alignParentRight="true"
            android:layout_weight="1"
            android:background="@android:color/transparent"
            android:src="@drawable/ic_launcher" />

        <ImageButton
            android:id="@+id/birthday"
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:layout_below="@+id/atm"
            android:layout_toLeftOf="@+id/coffee"
            android:layout_weight="1"
            android:background="@android:color/transparent"
            android:src="@drawable/ic_action_search" />

        <ImageButton
            android:id="@+id/airport"
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:layout_above="@+id/beauty"
            android:layout_alignLeft="@+id/beauty"
            android:layout_weight="1"
            android:background="@android:color/transparent"
            android:src="@drawable/ic_launcher" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:orientation="horizontal"
        android:weightSum="3" >

        <ImageButton
            android:id="@+id/education"
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:layout_alignParentRight="true"
            android:layout_below="@+id/coffee"
            android:layout_weight="1"
            android:background="@android:color/transparent"
            android:src="@drawable/ic_action_search" />

        <ImageButton
            android:id="@+id/coffee"
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:layout_alignParentRight="true"
            android:layout_below="@+id/bar"
            android:layout_weight="1"
            android:background="@android:color/transparent"
            android:src="@drawable/ic_action_search" />

        <ImageButton
            android:id="@+id/beauty"
            android:layout_width="wrap_content"
            android:layout_height="fill_parent"
            android:layout_centerVertical="true"
            android:layout_toLeftOf="@+id/atm"
            android:layout_weight="1"
            android:background="@android:color/transparent"
            android:src="@drawable/ic_action_search" />
    </LinearLayout>

</LinearLayout>

I have changed the source of the images I think you can modify it.

Upvotes: 2

Related Questions