开发者

Android Custom button with imageview and textview inside?

I'm looking to create a custom button. This butto开发者_Python百科n ideally would have an image on the left and a textview on the right. How would I accomplish this?


The fastest way

Create clickable View with Button drawable as background that contains ImageView and TextView.

<RelativeLayout
    android:clickable="true"
    android:background="@android:drawable/btn_default"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
    <ImageView
        android:id="@+id/image"
        android:layout_alignParentLeft="true"
        android:layout_centerVertical="true"
        android:src="@android:drawable/ic_input_add"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
    </ImageView>
    <TextView
        android:id="@+id/text"
        android:text="Sample text"
        android:textAppearance="?android:attr/textAppearanceButton"
        android:layout_toRightOf="@id/image"
        android:layout_centerVertical="true"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"></TextView>
</RelativeLayout>

Other way

Create your own class, extend RelativeLayout, set content view as above, add custom methods to set text, image etc. and that's all. Use your custom layout.


you may to use such code for that task:

<Button
 android:layout_width="fill_parent"
 android:layout_height="50dp"
 android:id="@+id/btnLogin"
 android:text="@string/text"
 android:gravity="center"
 android:drawableLeft="@drawable/your_image"
 android:background="@drawable/login"/> // this is for nice background - *.9.png


Create a xml with the Layout you want, xreate a drawable which look like you want the Button to look, add the drawable as background to Linear Layout and inflate the xml to a custom view.

Example drawable:

  <?xml version="1.0" encoding="utf-8"?> 
  <selector xmlns:android="http://schemas.android.com/apk/res/android">     
<item android:state_pressed="true" >         
    <shape>             
        <solid android:color="#f3ae1b" />             
        <stroke android:width="1dp" android:color="#bb6008" />             
        <corners android:radius="3dp" />             
        <padding android:left="10dp" android:top="10dp" android:right="10dp" android:bottom="10dp" />         
    </shape>     
</item>     
<item>         
    <shape>             
        <gradient 
            android:startColor="#f3ae1b" 
            android:endColor="#bb6008" 
            android:angle="270" />             
        <stroke 
            android:width="1dp" 
            android:color="#bb6008" />             
        <corners 
            android:radius="4dp" />             
        <padding 
            android:left="10dp" 
            android:top="10dp" 
            android:right="10dp" 
            android:bottom="10dp" />         
    </shape>     
</item> 
  </selector> 

Edit: Code to inflate

private LayoutInflater mInflater;
mInflater = LayoutInflater.from(this);
public LinearLayout yourButton;
yourButton = (LinearLayout)  mInflater.inflate(R.xml.yourButton, null);


In Xml layout use this drawable layout options and get simple layouts.The following line gives the image at the left side of the text.

android:drawableLeft="@drawable/image"


If you want to write code to do this, use setCompoundDrawables() of the Button class to decide where the drawable should appear relative to text. Look for the API for more details.


You can do this by using NoboButton

Simple and fast way to create android button with icon, radius, background

Library url https://github.com/alex31n/NoboButton

Screenshot https://raw.githubusercontent.com/alex31n/NoboButton/master/Assets/button_screenshot.jpg

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜