CODEWITHSUNDEEP
androidbuttonuitextposition
SteBra
SteBra

Reputation: 4247

Android Button text positioning

How can I make the text appear NEXT to a button, instead of being ON the button?

Here is a screenshot of what i need:

enter image description here

You can see the text on the first button. It is written ON the button, and I couldn't move it from it (aside from changing the gravity, but it's not really what I am after). Next to a second button, I put a label, as a guideline of something I would like to achieve.

Is there a way of doing this in Android? it is pretty straightforward in ObjectiveC.

Upvotes: 1

Views: 6717

Answers (6)

Noor Hossain
Noor Hossain

Reputation: 1831

It is Very Simple. Just Use android:drawableLeft. In Your Button, drawable image as follows : 

       <Button
        android:layout_marginTop="20dp"
        android:layout_width="250dp"
        android:layout_height="50dp"
        android:text="button"
        android:drawableLeft="@mipmap/ic_launcher_round"/>

Upvotes: 0

Phant&#244;maxx
Phant&#244;maxx

Reputation: 38098

You can use a TextView instead of a button.
TextViews are clickable, the very same way as buttons are.

And the listeners are assigned in the same way as you would do with buttons.
So, very small changes in code are needed (renaming your controls prefixes and changing type from Button to TextView, which is really a trivial task).

You can add a drawable to it, by specifying the attribute android:dawableLeft="@drawable/my_icon", for a left side graphics

You can use drawableLeft and/or drawableRigth and/or drawableTop and/or drawableBottom.
You can specify drawablePadding, to add some space between the graphics and the text

This is a best practice, in keeping your design hyerarchy as flatten as possible.

Note that you are not limited to images... you can use xml drawables too!

Upvotes: 5

MaD
MaD

Reputation: 13

Something like that:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <Button
        android:id="@+id/btn1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Button1"/>
    <Button
        android:id="@+id/btn2"
        android:layout_below="@id/btn1"
        android:layout_width="80dp"
        android:layout_height="80dp"
        android:text="Button2"/>
    <TextView
        android:layout_below="@id/btn1"
        android:layout_width="40dp"
        android:layout_height="80dp"
        android:text="Text"
        android:gravity="center"
        android:layout_toRightOf="@id/btn2"/>

    </RelativeLayout>

It's not perfect example but I hope it helps.

Upvotes: 0

xXJJJasonMokXx
xXJJJasonMokXx

Reputation: 367

You can use a RelativeLayout to wrap the two elements and easily use layout_rightOf to position the TextView next to the Button, hope it helps :)

Upvotes: 0

DJhon
DJhon

Reputation: 1518

Try Relative Layout. There is one attribute align_leftof

Upvotes: 0

Dan Harms
Dan Harms

Reputation: 4840

You can wrap your second Button and TextView in a horizontal LinearLayout. This will cause the text to be to the right of the button.

Upvotes: 0

Related Questions