ramesh
ramesh

Reputation: 4082

Android arrange layout with height as percentage

I am very new to android and practicing. I am trying to design a screen. which will contain a background image and a floating container with sliding menus. ( For more details please find the attached image )

My layout consists of a background image, a container with some icons which float at the bottom but with some margin to the bottom ( see attached photo )

As best of my knowledge this can be achieved by arranging a "Relative Layout" at the bottom and place images in it. Is it correct ?

Also I would likes to add a repeating transparent image as the background of the floating div.

Please give me a good advise or point me to a good tutorial

Thanks in advance

enter image description here

Upvotes: 17

Views: 45476

Answers (5)

dor506
dor506

Reputation: 5404

You can achieve this with the new percent support library: https://developer.android.com/tools/support-library/features.html#percent

By doing something like this:

<android.support.percent.PercentRelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <View
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_alignParentBottom="true"
        app:layout_heightPercent="11%"
        app:layout_widthPercent="100%" />

</android.support.percent.PercentRelativeLayout>

Upvotes: 4

Aleksey Makarov
Aleksey Makarov

Reputation: 189

<view android:layout_width="wrap_content"
      class="net.zel.percentage.PercentageButton"
      android:id="@+id/button"
      android:layout_height="wrap_content"

      customView:percentage_width="50"
      customView:percentage_height="50"

      />

so you can add the desired attributes in a library
https://github.com/metrolog3005/percentage_view

Upvotes: 0

NcJie
NcJie

Reputation: 812

You can use LinearLayout and set the layout_weight as % in xml

As for the repeating background you can use tileMode

Example: Note that the weightSum is set to 100, to indicate the total weight will be 100. Having layout_weight=10 will give it 10% space allocation.

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical"
    android:layout_gravity="bottom"
    android:weightSum="100">
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="10"
        android:background="@drawable/bg"
        android:orientation="horizontal"
        android:tileMode="repeat" >
    </LinearLayout>
    <View 
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="5" />
</LinearLayout>

Upvotes: 38

Amrit
Amrit

Reputation: 2333

For your requirement any Layout is ok. You can achieve this by Linear layout too. If I understand your requirement right, then check this discussion.

How to make android app's background image repeat

Upvotes: 0

Iftikar Urrhman Khan
Iftikar Urrhman Khan

Reputation: 1131

if you want to divide height in percentage then you need a linear layout with orientation horizontal and add layout_weight for each item.

linear layout guide

Upvotes: 1

Related Questions