Chendd's Blog

世界上没有什么事情是一行代码不能解决的。如果有,那就两行。

Android学习日记3--常用控件button/imagebutton

常用控件

       控件是对数据和方法的封装。控件可以有自己的属性和方法。属性是控件数据的简单访问者。方法则是控件的一些简单而可见的功能。所有控件都是继承View类

       介绍android原生提供几种常用的控件button/imagebutton、checkbox/radiobutton、progressbar/seekbar、tabSpec/tabHost、ListView、Dialog,主要为了掌握控件使用的一般规律。

1、button 按钮

       Button是各种UI中最常用的控件之一,用户可以通过触摸它来触发一系列事件,要知道一个没有点击事件的Button是没有任何意义的,

因为使用者的固定思维是见到它就想去点!

       布局文件里button的xml声明:

1
2
3
4
5
<Button
       android:layout_width="fill_parent"
       android:layout_height="wrap_content"
       android:text="@string/btn_ok"
       android:id="@+id/btn_ok"/>
1
2
android:layout_width="wrap_content" --自适应,据自己的值占据控件来决定大小
android:layout_height="fill_parent" --充满父控件,自动放大到与父控件一样的大小

       其中每个组件的layout_width和layout_height属性是必须的        一般也可以是具体的大小,即:数字+单位,如android:layout_height =“30px",由于移动设备屏幕尺寸太多了,不推荐使用强制设定大小,通用性不好。

       @+表示声明,新增一个id,会自动在R.java文件里创建。如 android:id=“@+id/btn_ok”,@表示引用 如

1
android:text="@string/hello_world"

       引用string.xml的名为hello_world的值。xml自定义值可以这样:

1
<string name="hello_world">Hello world!</string>

       有些人会问直接 android:text=“Hello world!"不是更方便,为什么还要引用xml文件?其实android这样设计为了国际化和编写弹性的应用程序,

       布局组件等一般设置格式:

1
2
3
<布局/组件名称
  android:属性="属性类型"
/>

       如底下的xml:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
<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"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >
    <!-- 线性布局  -->
     <LinearLayout
     android:layout_width="fill_parent"
     android:layout_height="wrap_content"
     android:orientation="horizontal">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/hello_world"
            android:id="@+id/tv"
            />


        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/btn_ok"
            android:id="@+id/btn_ok"
            />

        <!-- wrap_content:自适应 -->
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/btn_cancle"
            android:id="@+id/btn_cancle"
            />

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

    </LinearLayout>

</RelativeLayout>

       几乎每个组件都是上面的声明方式。

       java代码里定义btn_ok = (Button)findViewById(R.id.btn_ok);其他组件也可以通过类似的方法获得,前提是在布局文件里有指定id,获得的类型都是Object,记得类型转化添加监听器 可以implements OnClickListener 重写 OnClick方法来自定义按钮按下触发事件。也可以通过内部类实现:

1
2
3
4
5
6
btn_ok.setOnClickListincer(new OnclickListner() {
  @override
  public void OnClick(View v) {
           ...
  }
})

       具体代码在第二点imagebutton里贴出代码。

2、imagebutton

       可添加背景图片,其他同Button。指定背景图片为res/drawable 下名为blank的图片:

1
android:background="@drawable/blank"

       注意:android res包底下的资源文件名都不能是中文或大写字母开头的。

1
2
3
event.getAction()==MotionEvent.ACTION_DOWN //监听按钮按下事件
event.getAction()==MotionEvent.ACTION_UP //监听按钮弹起事件
getResources().getDrawable //获得资源图片的方法
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
package com.example.button;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.View.OnTouchListener;
import android.widget.Button;
import android.widget.ImageButton;
import android.widget.TextView;

public class MainActivity extends Activity{
    private TextView tv;
    private Button btn_ok,btn_cancle;
    private ImageButton btn_img;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        tv = (TextView)findViewById(R.id.tv);

        btn_ok = (Button)findViewById(R.id.btn_ok);
        btn_cancle = (Button)findViewById(R.id.btn_cancle);

        btn_img = (ImageButton)findViewById(R.id.btn_img);

        // 内部类 实现 监听
        btn_img.setOnTouchListener(new OnTouchListener() {

            @Override
            public boolean onTouch(View v, MotionEvent event) {
                // TODO Auto-generated method stub
                if(event.getAction()==MotionEvent.ACTION_DOWN) {
                    btn_img.setBackgroundDrawable(getResources().getDrawable(R.drawable.face1));
                }else if(event.getAction()==MotionEvent.ACTION_UP) {
                    btn_img.setBackgroundDrawable(getResources().getDrawable(R.drawable.blank));
                }
                return false;
            }
        });

        // 也可以 通过implements OnClickListener 实现监听
        btn_ok.setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View v) {
                // TODO Auto-generated method stub
                if(v == btn_ok) {
                    tv.setText("触发确定按钮事件");
                }
            }
        });

        // 内部类 实现监听器
        btn_cancle.setOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View v) {
                // TODO Auto-generated method stub
                if(v == btn_cancle) {
                    tv.setText("触发取消按钮事件");
                }
            }
        });


    }


    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.main, menu);
        return true;
    }


}

       代码运行效果:

点击'确定'按钮,左边textview 显示'触发确定按钮'

点击 imagebutton 显示笑脸,放开即还原。

image

       顺便说点监听器的题外话:

  • 监听器是个抽象类,它包含了一个事件触发时系统会去调用的函数;

  • 在子类中,根据您项目的需要重写这个函数;

  • 派生后的监听器需要绑定到按钮上,就像一个耳机可以发出声音,但您不去戴它,您是听不到它发出的声音的。一般的情况是这个按钮可能需要这个监听器,而另外一个按钮需要另外一个监听器,每个监听器各司其职,但功能相似时,也可以多个按钮共同绑定一个监听器;

  • 各种控件,都有常用的事件,如点击按钮,拖动一个滚动条,切换一个ListView的选项等等,他的绑定监听器的函数命名规则是setOnXXListener

Comments