安卓控件使用系列9：Button实现图文混排

安卓中使用Button控件进行图文混排是经常遇到的需求背景。下面我们来和大家分享一下如何实现这样的功能。

整体思路：第一种方法：通过设置Button控件的drawableTop或drawableLeft等属性（也可以同时设置两个属性，这样加载的两个图片来进行图文混排），来指定图片的位置，实现Button控件的图文混排功能，这种方法操作比较简单；第二种方法是通过代码来实现图片的加载，首先定义分割字符串，定义指向指定图片的位图对象，把要设置的文本和位图对象加载Button控件上，实现图文混排的效果。

activity_main.xml文件：

<LinearLayout 
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical"
    >
    <LinearLayout 
        android:layout_width="fill_parent"
        android:layout_height="120dp"
        android:orientation="horizontal"
        >
        <Button 
            android:id="@+id/button1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:drawableTop="@drawable/test2"
            android:text="按钮"
            />
        
        <Button 
            android:id="@+id/button2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:drawableTop="@drawable/test2"
            android:drawablePadding="30dp"
            android:text="按钮"
            />
        
          <Button 
            android:id="@+id/button3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:drawableTop="@drawable/test2"
            android:drawableLeft="@drawable/test2"
            android:text="按钮"
              />
          
            <Button 
            android:id="@+id/button4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
             android:drawablePadding="30dp"
            android:drawableRight="@drawable/test2"
            android:text="按钮"
              />
    </LinearLayout>
    
       <Button 
           android:id="@+id/button"
           android:layout_width="fill_parent"
           android:layout_height="wrap_content"
           />
      
        <Button 
           android:id="@+id/testbutton"
           android:layout_width="fill_parent"
           android:layout_height="wrap_content"
           android:drawableLeft="@drawable/image_left"
           android:drawableRight="@drawable/image_right"
           android:text="我的按钮"
           />
</LinearLayout>

MainActivity.java文件：

<span style="color:#cc33cc;">         </span>protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		Button button=(Button)findViewById(R.id.button);
		SpannableString spannableStringLeft=new SpannableString("left");
		Bitmap bitmapLeft=BitmapFactory.decodeResource(getResources(), R.drawable.image_left);
		ImageSpan imageSpanLeft=new ImageSpan(bitmapLeft,DynamicDrawableSpan.ALIGN_BOTTOM);
		spannableStringLeft.setSpan(imageSpanLeft, 0, 4, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
		
		SpannableString spannableStringRight=new SpannableString("right");
		Bitmap bitmapRight=BitmapFactory.decodeResource(getResources(), R.drawable.image_right);
		ImageSpan imageSpanRight=new ImageSpan(bitmapRight);
		spannableStringRight.setSpan(imageSpanRight, 0, 4, Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
		
		button.append(spannableStringLeft);
		button.append("我的按钮");
		button.append(spannableStringRight);
		
	}