系出名门Android(5) - 控件(View)之TextView, Button, ImageButton, ImageView, CheckBox

简介:
[索引页]
[源码下载]


系出名门Android(5) - 控件(View)之TextView, Button, ImageButton, ImageView, CheckBox, RadioButton, AnalogClock, DigitalClock


作者: webabcd


介绍
在 Android 中使用各种控件(View)
  • TextView - 文本显示控件
  • Button - 按钮控件
  • ImageButton - 图片按钮控件
  • ImageView - 图片显示控件
  • CheckBox - 复选框控件
  • RadioButton - 单选框控件
  • AnalogClock - 钟表(带表盘的那种)控件
  • DigitalClock - 电子表控件


1、TextView 的 Demo
textview.xml
<? xml  version ="1.0"  encoding ="utf-8" ?> 
< LinearLayout  xmlns:android ="http://schemas.android.com/apk/res/android" 
         android:orientation ="vertical"  android:layout_width ="fill_parent" 
         android:layout_height ="fill_parent" > 
         
        <!--  
                TextView - 文本显示控件 
        
--> 
         < TextView  android:layout_width ="fill_parent" 
                 android:layout_height ="wrap_content"  android:id ="@+id/textView"  /> 
                 
</ LinearLayout >

_TextView.java
 
package com.webabcd.view; 

import android.app.Activity; 
import android.os.Bundle; 
import android.widget.TextView; 

public  class _TextView  extends Activity { 

        @Override 
         protected  void onCreate(Bundle savedInstanceState) { 
                 // TODO Auto-generated method stub 
                 super.onCreate(savedInstanceState); 
                 this.setContentView(R.layout.textview); 

                 // 设置 Activity 的标题 
                setTitle( "TextView"); 
                 
                TextView txt = (TextView)  this.findViewById(R.id.textView); 
                 // 设置文本显示控件的文本内容,需要换行的话就用“\n” 
                txt.setText( "我是 TextView\n显示文字用的"); 
        } 
}
 
 
2、Button 的 Demo
button.xml
<? xml  version ="1.0"  encoding ="utf-8" ?> 
< LinearLayout  xmlns:android ="http://schemas.android.com/apk/res/android" 
         android:orientation ="vertical"  android:layout_width ="fill_parent" 
         android:layout_height ="fill_parent" > 
         
         < TextView  android:layout_width ="fill_parent" 
                 android:layout_height ="wrap_content"  android:id ="@+id/textView"  /> 
         
         <!--  
                 Button - 按钮控件 
         
-->         
         < Button  android:id ="@+id/button" 
                 android:layout_width ="wrap_content"  android:layout_height ="wrap_content" > 
         </ Button > 
         
</ LinearLayout >
 
_Button.java
package com.webabcd.view; 

import android.app.Activity; 
import android.os.Bundle; 
import android.view.View; 
import android.widget.Button; 
import android.widget.TextView; 

public  class _Button  extends Activity { 

        @Override 
         protected  void onCreate(Bundle savedInstanceState) { 
                 // TODO Auto-generated method stub 
                 super.onCreate(savedInstanceState); 
                 this.setContentView(R.layout.button); 

                setTitle( "Button"); 
                 
                Button btn = (Button)  this.findViewById(R.id.button); 
                btn.setText( "click me"); 
                 
                 // setOnClickListener() - 响应按钮的鼠标单击事件 
                btn.setOnClickListener( new Button.OnClickListener(){ 
                        @Override 
                         public  void onClick(View v) { 
                                TextView txt = (TextView) _Button. this.findViewById(R.id.textView); 
                                txt.setText( "按钮被单击了"); 
                        } 
                }); 
        } 
}
 
 
3、ImageButton 的 Demo
imagebutton.xml
<? xml  version ="1.0"  encoding ="utf-8" ?> 
< LinearLayout  xmlns:android ="http://schemas.android.com/apk/res/android" 
         android:orientation ="vertical"  android:layout_width ="fill_parent" 
         android:layout_height ="fill_parent" > 
         
         < TextView  android:layout_width ="fill_parent" 
                 android:layout_height ="wrap_content"  android:id ="@+id/textView"  /> 
         
        <!--  
                ImageButton - 图片按钮控件 
        
-->         
         < ImageButton  android:id ="@+id/imageButton" 
                 android:layout_width ="wrap_content"  android:layout_height ="wrap_content" > 
         </ ImageButton > 
         
</ LinearLayout >
 
_ImageButton.java
package com.webabcd.view; 

import android.app.Activity; 
import android.os.Bundle; 
import android.view.View; 
import android.widget.Button; 
import android.widget.ImageButton; 
import android.widget.TextView; 

public  class _ImageButton  extends Activity { 

        @Override 
         protected  void onCreate(Bundle savedInstanceState) { 
                 // TODO Auto-generated method stub 
                 super.onCreate(savedInstanceState); 
                 this.setContentView(R.layout.imagebutton); 

                setTitle( "ImageButton"); 
                 
                ImageButton imgButton = (ImageButton)  this.findViewById(R.id.imageButton); 
                 // 设置图片按钮的背景 
                imgButton.setBackgroundResource(R.drawable.icon01); 
                 
                 // setOnClickListener() - 响应图片按钮的鼠标单击事件 
                imgButton.setOnClickListener( new Button.OnClickListener(){ 
                        @Override 
                         public  void onClick(View v) { 
                                TextView txt = (TextView) _ImageButton. this.findViewById(R.id.textView); 
                                txt.setText( "图片按钮被单击了"); 
                        } 
                }); 
        } 
}
 
 
4、ImageView 的 Demo
imageview.xml
<? xml  version ="1.0"  encoding ="utf-8" ?> 
< LinearLayout  xmlns:android ="http://schemas.android.com/apk/res/android" 
         android:orientation ="vertical"  android:layout_width ="fill_parent" 
         android:layout_height ="fill_parent" > 
         
        <!--  
                ImageView - 图片显示控件 
        
--> 
         < ImageView  android:id ="@+id/imageView"  android:layout_width ="wrap_content" 
                 android:layout_height ="wrap_content" > </ ImageView > 
                 
</ LinearLayout >
 
_ImageView.java
package com.webabcd.view; 

import android.app.Activity; 
import android.os.Bundle; 
import android.widget.ImageView; 

public  class _ImageView  extends Activity { 

        @Override 
         protected  void onCreate(Bundle savedInstanceState) { 
                 // TODO Auto-generated method stub 
                 super.onCreate(savedInstanceState); 
                 this.setContentView(R.layout.imageview); 

                setTitle( "ImageView"); 
                 
                ImageView imgView = (ImageView)  this.findViewById(R.id.imageView); 
                 // 指定需要显示的图片 
                imgView.setBackgroundResource(R.drawable.icon01); 
        } 
}
 
 
5、CheckBox 的 Demo
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 ="fill_parent" 
         android:layout_height ="fill_parent" > 
         
         < TextView  android:layout_width ="fill_parent" 
                 android:layout_height ="wrap_content"  android:id ="@+id/textView"  /> 
                 
        <!--  
                CheckBox - 复选框控件 
        
--> 
         < CheckBox  android:text ="CheckBox01"  android:id ="@+id/chk1" 
                 android:layout_width ="wrap_content"  android:layout_height ="wrap_content" > </ CheckBox > 
         < CheckBox  android:text ="CheckBox02"  android:id ="@+id/chk2" 
                 android:layout_width ="wrap_content"  android:layout_height ="wrap_content" > </ CheckBox > 
         < CheckBox  android:text ="CheckBox03"  android:id ="@+id/chk3" 
                 android:layout_width ="wrap_content"  android:layout_height ="wrap_content" > </ CheckBox > 
                 
</ LinearLayout >
 
_CheckBox.java
package com.webabcd.view; 

import android.app.Activity; 
import android.os.Bundle; 
import android.widget.CheckBox; 
import android.widget.CompoundButton; 
import android.widget.TextView; 

public  class _CheckBox  extends Activity { 

        @Override 
         protected  void onCreate(Bundle savedInstanceState) { 
                 // TODO Auto-generated method stub 
                 super.onCreate(savedInstanceState); 
                 this.setContentView(R.layout.checkbox); 

                setTitle( "CheckBox"); 
                 
                CheckBox chk = (CheckBox)  this.findViewById(R.id.chk1); 
                 // setOnCheckedChangeListener() - 响应复选框的选中状态改变事件 
                chk.setOnCheckedChangeListener( new CompoundButton.OnCheckedChangeListener() { 
                        @Override 
                         public  void onCheckedChanged(CompoundButton buttonView,  boolean isChecked) { 
                                TextView txt = (TextView) _CheckBox. this.findViewById(R.id.textView); 
                                txt.setText( "CheckBox01 的选中状态:" + String.valueOf(isChecked));                                 
                        } 
                }); 
        } 
}
 
 
6、RadioButton 的 Demo
radiobutton.xml
<? xml  version ="1.0"  encoding ="utf-8" ?> 
< LinearLayout  xmlns:android ="http://schemas.android.com/apk/res/android" 
         android:orientation ="vertical"  android:layout_width ="fill_parent" 
         android:layout_height ="fill_parent" > 
         
         < TextView  android:layout_width ="fill_parent" 
                 android:layout_height ="wrap_content"  android:id ="@+id/textView"  /> 
                 
        <!--  
                RadioButton - 单选框控件 
                RadioGroup - 对其内的单选框控件做分组 
                        checkedButton - 指定组内被选中的单选框的 ID 
        
--> 
         < RadioGroup  android:id ="@+id/radioGroup" 
                 android:layout_width ="fill_parent"  android:layout_height ="fill_parent" 
                 android:checkedButton ="@+id/rad3"  android:orientation ="horizontal" 
                 android:gravity ="center_vertical|center_horizontal" > 
                 < RadioButton  android:text ="rad1"  android:id ="@+id/rad1" 
                         android:layout_width ="wrap_content"  android:layout_height ="wrap_content" > </ RadioButton > 
                 < RadioButton  android:text ="rad2"  android:id ="@+id/rad2" 
                         android:layout_width ="wrap_content"  android:layout_height ="wrap_content" > </ RadioButton > 
                 < RadioButton  android:text ="rad3"  android:id ="@+id/rad3" 
                         android:layout_width ="wrap_content"  android:layout_height ="wrap_content" > </ RadioButton > 
         </ RadioGroup > 
         
</ LinearLayout >
 
_RadioButton.java
package com.webabcd.view; 

import android.app.Activity; 
import android.os.Bundle; 
import android.widget.RadioButton; 
import android.widget.RadioGroup; 
import android.widget.TextView; 

public  class _RadioButton  extends Activity { 

        @Override 
         protected  void onCreate(Bundle savedInstanceState) { 
                 // TODO Auto-generated method stub 
                 super.onCreate(savedInstanceState); 
                 this.setContentView(R.layout.radiobutton); 

                setTitle( "RadioButton"); 
                 
                RadioGroup group = (RadioGroup)  this.findViewById(R.id.radioGroup); 
                 // setOnCheckedChangeListener() - 响应单选框组内的选中项发生变化时的事件 
                group.setOnCheckedChangeListener( new RadioGroup.OnCheckedChangeListener() {         
                        @Override 
                         public  void onCheckedChanged(RadioGroup group,  int checkedId) { 
                                TextView txt = (TextView) _RadioButton. this.findViewById(R.id.textView); 
                                txt.setText(((RadioButton)findViewById(checkedId)).getText() +  " 被选中");                                         
                        } 
                });    
        } 
}
 
 
7、AnalogClock 的 Demo
analogclock.xml
<? xml  version ="1.0"  encoding ="utf-8" ?> 
< LinearLayout  xmlns:android ="http://schemas.android.com/apk/res/android" 
         android:orientation ="vertical"  android:layout_width ="fill_parent" 
         android:layout_height ="fill_parent" > 
         
        <!--  
                AnalogClock - 钟表(带表盘的那种)控件 
        
--> 
         < AnalogClock  android:id ="@+id/analogClock" 
                 android:layout_width ="wrap_content"  android:layout_height ="wrap_content" > 
         </ AnalogClock > 
         
</ LinearLayout >
 
_AnalogClock.java
package com.webabcd.view; 

import android.app.Activity; 
import android.os.Bundle; 

public  class _AnalogClock  extends Activity { 

        @Override 
         protected  void onCreate(Bundle savedInstanceState) { 
                 // TODO Auto-generated method stub 
                 super.onCreate(savedInstanceState); 
                 this.setContentView(R.layout.analogclcok); 

                setTitle( "AnalogClock"); 
        } 
}
 
 
8、DigitalClock 的 Demo
digitalclock.xml
<? xml  version ="1.0"  encoding ="utf-8" ?> 
< LinearLayout  xmlns:android ="http://schemas.android.com/apk/res/android" 
         android:orientation ="vertical"  android:layout_width ="fill_parent" 
         android:layout_height ="fill_parent" > 
         
        <!--  
                DigitalClock - 电子表控件 
        
--> 
         < DigitalClock  android:id ="@+id/digitalClock" 
                 android:layout_width ="wrap_content"  android:layout_height ="wrap_content" > 
         </ DigitalClock > 
         
</ LinearLayout >
 
_DigitalClock.java
package com.webabcd.view; 

import android.app.Activity; 
import android.os.Bundle; 

public  class _DigitalClock  extends Activity { 

        @Override 
         protected  void onCreate(Bundle savedInstanceState) { 
                 // TODO Auto-generated method stub 
                 super.onCreate(savedInstanceState); 
                 this.setContentView(R.layout.digitalclcok); 

                setTitle( "DigitalClcok"); 
        } 
}
 
 
 



       本文转自webabcd 51CTO博客,原文链接:http://blog.51cto.com/webabcd/342055 ,如需转载请自行联系原作者
相关文章
|
4月前
|
Android开发 UED 计算机视觉
Android自定义view之线条等待动画(灵感来源:金铲铲之战)
本文介绍了一款受游戏“金铲铲之战”启发的Android自定义View——线条等待动画的实现过程。通过将布局分为10份,利用`onSizeChanged`测量最小长度,并借助画笔绘制动态线条,实现渐变伸缩效果。动画逻辑通过四个变量控制线条的增长与回退,最终形成流畅的等待动画。代码中详细展示了画笔初始化、线条绘制及动画更新的核心步骤,并提供完整源码供参考。此动画适用于加载场景,提升用户体验。
407 5
Android自定义view之线条等待动画(灵感来源:金铲铲之战)
|
4月前
|
XML Java Android开发
Android自定义view之网易云推荐歌单界面
本文详细介绍了如何通过自定义View实现网易云音乐推荐歌单界面的效果。首先,作者自定义了一个圆角图片控件`MellowImageView`,用于绘制圆角矩形图片。接着,通过将布局放入`HorizontalScrollView`中,实现了左右滑动功能,并使用`ViewFlipper`添加图片切换动画效果。文章提供了完整的代码示例,包括XML布局、动画文件和Java代码,最终展示了实现效果。此教程适合想了解自定义View和动画效果的开发者。
208 65
Android自定义view之网易云推荐歌单界面
|
4月前
|
XML 前端开发 Android开发
一篇文章带你走近Android自定义view
这是一篇关于Android自定义View的全面教程,涵盖从基础到进阶的知识点。文章首先讲解了自定义View的必要性及简单实现(如通过三个构造函数解决焦点问题),接着深入探讨Canvas绘图、自定义属性设置、动画实现等内容。还提供了具体案例,如跑马灯、折线图、太极图等。此外,文章详细解析了View绘制流程(measure、layout、draw)和事件分发机制。最后延伸至SurfaceView、GLSurfaceView、SVG动画等高级主题,并附带GitHub案例供实践。适合希望深入理解Android自定义View的开发者学习参考。
509 84
|
4月前
|
前端开发 Android开发 UED
讲讲Android为自定义view提供的SurfaceView
本文详细介绍了Android中自定义View时使用SurfaceView的必要性和实现方式。首先分析了在复杂绘制逻辑和高频界面更新场景下,传统View可能引发卡顿的问题,进而引出SurfaceView作为解决方案。文章通过Android官方Demo展示了SurfaceView的基本用法,包括实现`SurfaceHolder.Callback2`接口、与Activity生命周期绑定、子线程中使用`lockCanvas()`和`unlockCanvasAndPost()`方法完成绘图操作。
102 3
|
2月前
|
安全 数据库 Android开发
在Android开发中实现两个Intent跳转及数据交换的方法
总结上述内容,在Android开发中,Intent不仅是活动跳转的桥梁,也是两个活动之间进行数据交换的媒介。运用Intent传递数据时需注意数据类型、传输大小限制以及安全性问题的处理,以确保应用的健壯性和安全性。
149 11
|
6月前
|
JavaScript Linux 网络安全
Termux安卓终端美化与开发实战:从下载到插件优化,小白也能玩转Linux
Termux是一款安卓平台上的开源终端模拟器,支持apt包管理、SSH连接及Python/Node.js/C++开发环境搭建,被誉为“手机上的Linux系统”。其特点包括零ROOT权限、跨平台开发和强大扩展性。本文详细介绍其安装准备、基础与高级环境配置、必备插件推荐、常见问题解决方法以及延伸学习资源,帮助用户充分利用Termux进行开发与学习。适用于Android 7+设备,原创内容转载请注明来源。
1223 77
|
3月前
|
安全 Java Android开发
为什么大厂要求安卓开发者掌握Kotlin和Jetpack?深度解析现代Android开发生态优雅草卓伊凡
为什么大厂要求安卓开发者掌握Kotlin和Jetpack?深度解析现代Android开发生态优雅草卓伊凡
170 0
为什么大厂要求安卓开发者掌握Kotlin和Jetpack?深度解析现代Android开发生态优雅草卓伊凡