Android学习笔记---第三天---基础UI组件---Button&ImageButton

Button

Button在之前已经用过他就是按钮控件，我们先来看一下他的常用属性

常用属性

android:layout_width     //设置组件宽，在之前使用过；所有组件都有的属性

android:layout_height     //设置组件宽，在之前使用过；所有组件都有的属性

android:id          //设置组件ID如@+id/newTextView；格式为@+id/(id名)；所有组件都有的属性

android:text         //文本内容

android:textSize       //字体大小单位为sp

android:layout_gravity    //该组件在父组件中的位置，之前使用过；所有组件都有的属性

android:gravity        //该组件中内容的位置，之前使用过；所有组件都有的属性

android:background     //设置文本背景色

android:textColor        //设置字体颜色

android:textStyle      //设置字体风格加粗与倾斜

android:minEms        //设置最小宽度单位em

android:maxEms        //设置最大宽度单位em

android:ems         //设置宽度单位em

adnroid:padding       //设置内边距

android:scrollHorizontally //是否允许水平滚动

android:drawableStart    //在文本框开始处绘制图片

android:drawableLeft    //在文本框左边处绘制图片，当然还有右边顶端底部等等；

他的父类的东西他当然都能用

Button单击事件

具体的实现方法有三种

方法一：

使用xml文件中指定onClick属性；

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="  指定onclick属性  "
        android:background="@android:color/holo_blue_light"
        android:textSize="30sp"
        android:textColor="@android:color/holo_red_light"
        android:drawableLeft="@drawable/ic_launcher"
        android:padding="20dp"
        android:id="@+id/button18"
        android:onClick="newButtonOnClick"
        />

在Java代码中

public class MainActivity extends AppCompatActivity {
    //中间省略。。。
    public void newButtonOnClick(View v){//方法名与android:onClick属性值相等其他固定不变；
        Toast.makeText(this,"onClick方法",Toast.LENGTH_LONG).show();
    }
}

方法二：

使用OnClickListener接口实现

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="使用View.OnClickListener接口实现"
        android:id="@+id/button21" />
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="使用View.OnClickListener接口实现"
        android:id="@+id/button22" />

Java代码

//多余代码省略。。。
public class MainActivity extends AppCompatActivity implements View.OnClickListener {
    private Button b1,b2,b3;
    public void onClick(View v){
        switch(v.getId()){
            case R.id.button21:{
                Toast.makeText(this,"使用View.OnClickListener接口实现的--b1",Toast.LENGTH_LONG).show();
            break;
            }
            case R.id.button22:{
                Toast.makeText(this,"使用View.OnClickListener接口实现的--b2",Toast.LENGTH_LONG).show();
                break;
            }
        }
    }
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.layoutbutton);

        b1=(Button)findViewById(R.id.button21);
        b2=(Button)findViewById(R.id.button22);
        b1.setOnClickListener(this);
        b2.setOnClickListener(this);
    }
    //多余代码省略。。。
}

方法三：

使用匿名内部类的方法实现

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="使用匿名内部类的方法实现的"
        android:id="@+id/button23" />

Java代码

        Button b3=(Button)findViewById(R.id.button23);
        b3.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(MainActivity.this,"使用匿名内部类的方法实现的--b3",Toast.LENGTH_LONG).show();
            }

效果图

Button的样式设置

style属性

style属性用于使用在xml中预定义的属性值，这是一个公共属性所组件都可以使用。

我们将刚才的按钮加上style属性；

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="使用View.OnClickListener接口实现"
        style="@style/MyStyle"//我自定义的
        android:id="@+id/button21"
    />
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="使用View.OnClickListener接口实现"
        android:id="@+id/button22"
        style="?android:attr/borderlessButtonStyle"/>//系统定义好的style将按钮透明

styles.xml

    <style name="MyStyle" >
        <item name="android:textColor">@android:color/holo_red_dark</item>
        <item name="android:text">使用预定义的属性值</item>
    </style>

大家可以看到我自己定义的style中与按钮有一个text属性是冲突的这时就会忽略style中的冲突属性所以文字颜色被改变二内容不变。

使用background属性设置样式

我们之前用这个属性设置过背景颜色但他的功能远不止设置背景颜色这么简单

我们可以用它来指定使用哪个Drawable resource File；

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="使用匿名内部类的方法实现的"
        android:id="@+id/button23"
        android:background="@drawable/buttonbackground"/>

Drawable resource File

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" android:drawable="@drawable/ic_launcher"></item><!--当按钮被按下时设置背景为一张图片-->
    <item android:drawable="@android:color/holo_blue_light"/><!--按钮默认背景为holo_blue_light颜色-->
</selector>

效果图

ImageButton

ImageButton是ImageView的子类,他与Button的属性用法基本一致，不同的是它只是用来加载图片的按钮，专门为图片按钮设计的组件，ImageButton不能显示文本没有text属性。

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

它增加了src属性用于指定图片；

我们将图片放入Button的背景中也能有一样的效果但是Button的内容是文本他会拉伸图片适应文本内容，而ImageButton的内容就是图片所以图片不会被拉伸保持原比例显示。

当然我们也可以用Drawable resource File来设置更好看的图片按钮

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/imageButton"
        android:background="@drawable/imagebuttondrawable"
        />

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" android:drawable="@drawable/investigation_down"/>
    <item android:drawable="@drawable/investigation_up"/>
</selector>