New UI-带图片(drawableXxx)的TextView

New UI-带图片(drawableXxx)的TextView

 ——转载请注明出处:coder-pig,欢迎转载,请勿用于商业用途!

小猪Android开发交流群已建立,欢迎大家加入,无论是新手,菜鸟,大神都可以,小猪一个人的

力量毕竟是有限的,写出来的东西肯定会有很多纰漏不足,欢迎大家指出,集思广益,让小猪的博文

更加的详尽,帮到更多的人,O(∩_∩)O谢谢!

小猪Android开发交流群:小猪Android开发交流群群号:421858269

新Android UI实例大全目录:http://blog.csdn.net/coder_pig/article/details/42145907

本节引言:

在实际开发的时候我们可能会遇到这种情况：

一个小图片+一个文字,然后放在一个LinearLayout中,这样需要4个LinearLayout,很明显

很浪费,这个时候我们就可以用到一个drawableTop来设置一个带图片的TextView!

本节正文:

1.基本用法:

设置图片的核心其实就是:drawableXxx;可以设置四个方向的图片:

drawableTop(上),drawableButtom(下),drawableLeft(左),drawableRight(右)

另外,你也可以使用drawablePadding来设置图片与文字间的间距:drawablePadding

这里演示下:

 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:tools="http://schemas.android.com/tools"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     tools:context="com.jay.example.test.MainActivity" >

     <TextView
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_centerInParent="true"
         android:drawableTop="@drawable/show1"
         android:drawableLeft="@drawable/show1"
         android:drawableRight="@drawable/show1"
         android:drawableBottom="@drawable/show1"
         android:drawablePadding="10dp"
         android:text="张全蛋" />

 RelativeLayout>

运行截图:

另外,还有一个问得比较多的一个问题就是:

2.如何来设置这个drawable的大小?

是不能直接在xml进行设置的,这就需要我们在Java代码中来进行修改了:

Java代码示例如下:

 package com.jay.example.test;

 import android.app.Activity;
 import android.graphics.drawable.Drawable;
 import android.os.Bundle;
 import android.widget.TextView;

 public class MainActivity extends Activity {

     private TextView txtZQD;

     @Override
     protected void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
         setContentView(R.layout.activity_main);
         txtZQD = (TextView) findViewById(R.id.txtZQD);
         Drawable[] drawable = txtZQD.getCompoundDrawables();
         // 数组下表0~3,依次是:左上右下
         drawable[1].setBounds(100, 0, 200, 200);
         txtZQD.setCompoundDrawables(drawable[0], drawable[1], drawable[2],
                 drawable[3]);
     }
 }

看下效果先:

代码分析:

①Drawable[] drawable = txtZQD.getCompoundDrawables( );

获得四个不同方向上的图片资源,数组元素依次是:左上右下的图片

②drawable[1].setBounds(100, 0, 200, 200);
接着获得资源后,可以调用setBounds设置左上右下坐标点,比如这里设置了代表的是:

长是:从离文字最左边开始100dp处到200dp处

宽是:从文字上方0dp处往上延伸200dp!

③txtZQD.setCompoundDrawables(drawable[0], drawable[1], drawable[2],
drawable[3]);

为TextView重新设置drawable数组!没有图片可以用null代替哦!

再接着就是

3..9图片的问题

在Java代码中为TextView设置Drawable的代码如下:

 Drawable top = getResources().getDrawable(R.drawable.ic);
 top.setBounds(0, 20, top.getMinimumWidth(),top.getMinimumHeight() + 20);
 view.setCompoundDrawables(top, null,null, null);

最后再分享一个

4.将png转换为bitmap的方法吧:

 //Drawable转换为Bitmap的方法
     public static Bitmap drawableToBitmap(Drawable drawable) {

             Bitmap bitmap = Bitmap
                             .createBitmap(
                                             drawable.getIntrinsicWidth(),
                                             drawable.getIntrinsicHeight(),
                                             drawable.getOpacity() != PixelFormat.OPAQUE ? Bitmap.Config.ARGB_8888
                                                             : Bitmap.Config.RGB_565);
             Canvas canvas = new Canvas(bitmap);
             //canvas.setBitmap(bitmap);
             drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight());
             drawable.draw(canvas);
             return bitmap;
     }

好了,关于TextView设置不同方向的Drawable就介绍到这里~