codeme2020
codeme2020

Reputation: 853

Android: Sizing Image Buttons and TextViews?

I am trying to add 3 text views and ImageButtons to my android layout. I have been trying to size them so that all 6 components fit on screen.

I trust that this is a very simple issue but I cannot solve it, it is very fustrating.

How can I do so?

Layout code:

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

    <TextView
        android:id="@+id/tvFirstTabMaths"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Maths"
        android:textSize="15dp" />

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

    <TextView
        android:id="@+id/tvFirstTabMemory"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text=" Memory"
        android:textSize="15dp" />


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


     <TextView
        android:id="@+id/tvFirstTabStroop"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Stroop"
        android:textSize="15dp" />

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


</LinearLayout>

Upvotes: 0

Views: 66

Answers (4)

rupesh jain
rupesh jain

Reputation: 3430

Try doing this:

 <?xml version="1.0" encoding="utf-8"?>

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent" android:layout_height="match_parent">
    <LinearLayout android:layout_width="match_parent"
        android:layout_height="match_parent" android:orientation="vertical">

        <TextView android:id="@+id/tvFirstTabMaths"
            android:layout_width="match_parent" android:layout_height="wrap_content"
            android:text="Maths" android:textSize="15dp" android:layout_weight="1" />

        <ImageButton android:id="@+id/ibFirstTabMathsButton"
            android:layout_width="match_parent" android:layout_height="wrap_content"
            android:src="@drawable/mathsicon" android:layout_weight=".5" />

        <TextView android:id="@+id/tvFirstTabMemory"
            android:layout_width="match_parent" android:layout_height="wrap_content"
            android:text=" Memory" android:textSize="15dp" android:layout_weight="1" />


        <ImageButton android:id="@+id/ibFirstTabMemoryButton"
            android:layout_width="match_parent" android:layout_height="wrap_content"
            android:src="@drawable/memoryicon" android:layout_weight=".5" />


        <TextView android:id="@+id/tvFirstTabStroop"
            android:layout_width="match_parent" android:layout_height="wrap_content"
            android:text="Stroop" android:textSize="15dp" android:layout_weight="1" />

        <ImageButton android:id="@+id/ibFirstTabStroopButton"
            android:layout_width="match_parent" android:layout_height="wrap_content"
            android:src="@drawable/stroopicon" android:layout_weight=".5" />


    </LinearLayout>
</ScrollView>

Upvotes: 1

TehCoder
TehCoder

Reputation: 209

If you want all 6 views to fit horizontally you should try getting the screen size programatically and then set the views width/params.

view.setWidth(width/6);

Upvotes: 0

user3497504
user3497504

Reputation: 106

Is you are using linear layout you should set the android:layout_weight to the childrens. From Documentation: " This attribute assigns an "importance" value to a view in terms of how much space is should occupy on the screen. A larger weight value allows it to expand to fill any remaining space in the parent view. Child views can specify a weight value, and then any remaining space in the view group is assigned to children in the proportion of their declared weight"

Upvotes: 0

Stephane Mathis
Stephane Mathis

Reputation: 6622

If you want to make them to fill the screen, you need to use layout_weight attribute.

Change all android:layout_height="wrap_content" to android:layout_height="0dp" and add android:layout_weight="1".


The weight make the views share the space available.

The weight can be a float, and it can be anything you want. It's like ratio, if you have something at 1 and another at 2, the second will be twice as big as the first.

You can also use weight_sum="10" on the LinearLayout, then if you give your child view less that 10 in weight, there will be empty space left. For instance you would get 6/10th of the screen with your buttons and 4/10th empty.

You can also put views without weight in a container with views that has weight. The first view will take its space, and the remaining space will be shared with the rest.

Upvotes: 0

Related Questions