第二章 吸引你的眼球—UI编程(3)

2.1.4图片显示—图片视图(ImageView)

如果一个界面全是由文字组成的,那这个界面一定是枯燥而乏味的。因此,在合适的位置,放上一些合适的图片,不仅能大大增加界面的美观,还能使你的应用更加吸引人。在Android中,要实现在界面上显示图片有很多种方法,在这里,我们介绍一下最常用的图片视图组件(ImageView)。ImageView用来显示任意图像图片,我们可以自己来定义显示的尺寸和颜色等。我们还是举个例子来看看ImageView是怎么使用的。

首先,在布局文件中定义ImageView组件:


<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout

xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="match_parent"

android:layout_height="match_parent">

<ImageView

android:id="@+id/my_imageview"

android:layout_centerInParent="true"

android:layout_width="200dp"

android:layout_height="200dp"

android:src="@drawable/p06"/>

</RelativeLayout>

在这里,我们在布局文件中定义了一个ID为my_imageview的ImageView组件。让它在界面上显示了一张p06.jpeg的图片,这张图片我们放在res/drawable目录下。

如果我们不在布局文件中设置图片的话,我们也可以在代码中来实现:


ImageView image = (ImageView)findViewById(R.id.my_imageview);

mage.setImageResource(R.drawable.p06);

需要注意的是,我们也可以用android:background="@drawable/p06"来设置图片。但是二者的使用又有区别:background会根据ImageView的长宽进行拉伸,而src就存放的是原图的大小,不会进行拉伸。当然,它们两个也可以同时使用。

下面,我们分别来看看src和background效果,如图2-9和2-10所示:

图2-9 src效果

图2-10 background效果

另外,ImageView中还有一些属性也是需要我们注意的:

android:adjustViewBounds 是否保持宽高比。需要与maxWidth、MaxHeight一起使用,单独使用没有效果;

android:cropToPadding 是否截取指定区域用空白代替。单独设置无效果,需要与scrollY一起使用 ;

android:maxHeight 定义View的最大高度,需要与AdjustViewBounds一起使用,单独使用没有效果。如果想设置图片固定大小,又想保持图片宽高比,需要如下设置:

1) 设置AdjustViewBounds为true;

2) 设置maxWidth、MaxHeight;

3) 设置设置layout_width和layout_height为wrap_content。

android:maxWidth 设置View的最大宽度。

android:scaleType 设置图片的填充方式。

android:src 设置View的图片或颜色

android:tint 将图片渲染成指定的颜色。


经验分享:

很多时候,我们设置图片往往要给图片设置透明度。src和background不同,设置图片透明度的方法也略有区别。

当我们是用src来设置图片的时候,我们在代码中直接就可以通过

myImageView.setAlpha(int alpha)来设置;

而如果是通过background来设置图片的话,我们就要先取得它的background然后再设置:myImageView.getBackground().setAlpha(int alpha)。

2.1.5多项选择—多选框(CheckBox)和单项选择—单选框(RadioBox)

1)多选框(CheckBox)

Android平台提供了CheckBox来实现多项选择。我们需要注意的是,既然是多项选择,那么为了确定用户是否选择了某一项,我们就需要对多选框的每一个选项进行事件监听。在这里,我们也用一个简单的例子来看看多选框是如何实现的。

首先,我们新建一个checkbox.xml的布局文件:


<?xml version="1.0" encoding="utf-8"?>

<LinearLayout

xmlns:android="http://schemas.android.com/apk/res/android"

android:orientation="vertical"

android:layout_width="match_parent"

android:layout_height="match_parent">

<TextView

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="请选择你感兴趣的运动"

android:textColor="@android:color/white"

android:textSize="20sp"/>

<CheckBox

android:id="@+id/my_checkbox1"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="游泳"/>

<CheckBox

android:id="@+id/my_checkbox2"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="跑步"/>

<CheckBox

android:id="@+id/my_checkbox3"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="打球"/>

</LinearLayout>

在这个布局文件中我们定义了一个TextView组件、三个CheckBox组件,然后,我们将该布局文件作为Activity的content view,效果如图2-11所示:

图2-11 CheckBox的使用

在代码中,我们可以分别对每一个CheckBox进行监听:


CheckBox checkBox1 = (CheckBox)findViewById(R.id.my_checkbox1);

CheckBox checkBox2 = (CheckBox)findViewById(R.id.my_checkbox2);

CheckBox checkBox3 = (CheckBox)findViewById(R.id.my_checkbox3);

checkBox1.setOnCheckedChangeListener(new OnCheckedChangeListener() {

@Override

public void onCheckedChanged(CompoundButton buttonView,

boolean isChecked) {

if(isChecked){

Log.d("test", "checkbox1 is isChecked");

}

}

});

checkBox2.setOnCheckedChangeListener(new OnCheckedChangeListener() {

@Override

public void onCheckedChanged(CompoundButton buttonView,

boolean isChecked) {

if(isChecked){

Log.d("test", "checkbox2 is isChecked");

}

}

});

checkBox3.setOnCheckedChangeListener(new OnCheckedChangeListener() {

@Override

public void onCheckedChanged(CompoundButton buttonView,

boolean isChecked) {

if(isChecked){

Log.d("test", "checkbox3 is isChecked");                          }

}

});

这样,我们对多选框的每一项都进行监听后,就可以针对每一个相应的操作进行处理了。

2)单选框(RadioGroup、RadioButton)

单选框和多选框不同,一次只能选择一个选项。Android平台提供了单选框的组件,可以通过RadioGroup、RadioButton组合起来实现单项选择的效果。

同样的,我们也以一个简单的例子来加以说明。

首先,新建一个radio.xml布局文件:


<?xml version="1.0" encoding="utf-8"?>

<LinearLayout

xmlns:android="http://schemas.android.com/apk/res/android"

android:orientation="vertical"

android:layout_width="match_parent"

android:layout_height="match_parent">

<TextView

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="请选择您的性别"

android:textColor="@android:color/white"

android:textSize="20sp"/>

<RadioGroup

android:id="@+id/my_rediogroup"

android:orientation="vertical"

android:layout_width="wrap_content"

android:layout_height="wrap_content">

<RadioButton

android:id="@+id/radio_man"

android:layout_width="wrap_content"

android:text="男"

android:layout_height="wrap_content"

android:checked="true"/>

<RadioButton

android:id="@+id/radio_woman"

android:layout_width="wrap_content"

android:text="女"

android:layout_height="wrap_content"/>

</RadioGroup>

</LinearLayout>

在这个布局文件中我们定义了一个TextView组件、一个RadioGroup组里面有两个RadioButton组件,然后,我们将该布局文件作为Activity的content view,效果如图2-12所示:

图2-12 RadioButton的使用

可以看到,在一组RadioGroup中只能有一个RadioButton被选中。

RadioButton除了可以和CheckBox一样进行监听之外,我们还能单独对RadioGroup进行监听:


RadioGroup myRadioGroup = (RadioGroup)findViewById(R.id. my_rediogroup);

myRadioGroup.setOnCheckedChangeListener(

new RadioGroup.OnCheckedChangeListener() {

@Override

public void onCheckedChanged(RadioGroup group, int checkedId) {

switch(checkedId){

case R.id.radio_man:

Log.d("test", "man  is isChecked");

Break;

case R.id.radio_woman:

Log.d("test", "woman is isChecked");

break;

}

mHandler.sendMessage(mHandler.obtainMessage(REFLASH));

}

});


经验分享:

我们要设置多选框的大小,并不能单纯地通过设置CheckBox的android:layout_width和android:layout_height属性来设定(如果只是这样的设定,大家不妨试一试,只能显示多选框的一部分形状,而不是把整个多选框等比的缩放),而是需要为它设置一个样式,并在样式中为它设置图片,例如:

<style name="gl_task_checkbox"

parent="@android:style/Widget.CompoundButton.CheckBox">

<item name="android:button">@drawable/图片名</item>

</style>

这样的话CheckBox才能按照我们设定的大小来显示。

时间: 2024-10-17 12:35:22

第二章 吸引你的眼球—UI编程(3)的相关文章

第二章 吸引你的眼球—UI编程(1)

第二章 吸引你的眼球-UI编程 学习Android应用程序的开发技术,除了先要熟悉相关工具以外,最直接的,就是学习如何使用各种UI组件.我们开发的应用程序,一般都会包含一组用户可见的界面,而这些界面就是由一个个的AndroidUI组件组成的.我们在学习界面开发技术的过程中,首先就要熟悉这些组件,然后才能将它们有效的组织起来,构成一个美观.合理的界面. 本章会先详细讲解一些常用的UI组件,及如何自定义组件,然后会说明一些其它常用的UI编程技术. 2.1 UI基础-常用UI组件 Android的组件

第二章 吸引你的眼球—UI编程(6)

2.2彰显你的个性-自定义UI组件 很多时候,Android的常用控件并不能满足我们的需求.为了吸引更多的眼球,达到标新立异的效果,我们可以自己来定义各种控件.我们可以通过继承基础控件来重写某些环节,当然我们也可以将多个控件组合成一个新控件来使用. 我们先来看看下面一个例子,在这个例子当中,我们实现了一个带有图片和文字的按钮. 首先,定义一个layout,实现按钮内部的布局.代码如下: <?xml version="1.0" encoding="utf-8"?

第二章 吸引你的眼球—UI编程(4)

2.1.6图片拖动-拖动效果(Gallery) 一个应用如果有非常炫的效果相信也可以吸引不少人的眼球.Gallery就是一个非常炫的效果,你可以用手指直接拖动图片进行移动,iPhone刚出现的时候,这个效果就吸引了无数的苹果粉丝为之疯狂,在Android平台上也可以实现这一效果.下面,我们以一个简单的像册例子来加以说明. 1)在布局文件中定义一个Gallery(用来展示图片)和一个TextView(用来监听Gallery点击事件). <Gallery android:id="@+id/my

第二章 吸引你的眼球—UI编程(7)

2.3简单明了的消息提示框(Toast)和对话框(Dialog) 2.3.1Toast提示 很多时候,我们需要对用户提供一些提示信息.比如,当用户登入应用程序时,提示用户"应用程序需要更新":当用户在输入框输入文本时,提示用户"最多能输入30个字符".这些需求,Toast轻松就能搞定! Toast是Android提供的"快显讯息"类.Toast使用起来非常简单,只需要简单的代码就能实现. Toast.makeText(Context contex

第二章 吸引你的眼球—UI编程(8)

2.4 Menu键的呼唤-Menu菜单 使用Android手机的朋友应该对手机的"Menu"键都不陌生吧.它使用起来方便.快捷,不需要占用应用的界面,正因为它的这些特性,我们现在有很多的应用都使用了Menu-菜单键. Menu菜单有好几种类型,它们各有各的展现形式,分别使用在不同的场合,以下我们逐一对它们进行介绍. 1)普通的Menu(选项菜单) 这是我们平时使用最多.也是最常见的菜单,它就是当用户单击设备上的菜单按键时弹出的菜单.它最多只能显示6个,超过6个则第六个自动显示"

第二章 吸引你的眼球—UI编程(2)

2.1.3文本编辑-编辑框(EditText) EditText在我们开发中也是经常要用到的组件.比如,要实现一个登录界面,需要用户输入帐号.密码.邮件等信息,这里就需要使用EditText组件来获得用户输入的内容,下面,我们就以一个登录界面为例,来看看EditText是怎么使用的. 1)在布局文件中定义一个TextView(用来响应按钮事件),两个EditText组件(一个用来记录用户名,一个用来记录密码)一个登录按钮和一个取消按钮,代码如下: <?xml version="1.0&qu

第二章 吸引你的眼球—UI编程(5)

2.1.7列表组件(ListView) ListView在Android中也是一个使用比较频繁的组件.它相对于其他的基本组件来说,使用起来稍微复杂一些,需要注意的也比较多,尤其是和其他一些组件组合起来使用的情况. 在Android中,ListView用来显示一个列表的组件,它以列表的形式展示具体的内容,并且能够根据数据的长度自适应显示.用户可以选择并操作这个列表,同时会触发相应的事件:当鼠标滚动时会触发setOnItemSelectedListener事件:当点击列表时会触发setOnItemC

第二章:线程安全性——java并发编程实战

一个对象是否需要是线程安全的取决于它是否被多个线程访问. 当多个线程访问同一个可变状态量时如果没有使用正确的同步规则,就有可能出错.解决办法: 不在线程之间共享该变量 将状态变量修改为不可变的 在访问状态变量时使用同步机制 完全由线程安全类构造的程序也不一定是线程安全的,线程安全类中也可以包含非线程安全的类 一.什么是线程安全性 线程安全是指多个线程在访问一个类时,如果不需要额外的同步,这个类的行为仍然是正确的.(因为线程安全类中封装了必要的同步代码) 一个无状态的类是线程安全的.无状态类是指不

大道至简(第二章)读后感

在读过<大道至简>第一章后给了我学好编程的信心,明白了编程并不是学不会只是自己的态度不对.之后我又开始阅读第二章,第二章的题目一下子吸引了我,因为我正是懒人一枚,看到题目后感觉好亲切(窃喜,懒人还是蛮有价值的嘛). 如同第一章一样,作者还是以典故开篇,引人入胜,开篇为<华阳志>里面的一段话,“樊道有蜀王兵阑,亦有神作大江滩中.其崖斩竣不可破,(冰)乃积薪烧之.”作者通过典故说服了我,原来真的是懒人创造了方法,如果李冰如同愚公一般勤劳,他肯定是不会想到积薪烧之的.我也通过这个故事看到