作者:@gzdaijie
本文为作者原创,转载请注明出处:http://www.cnblogs.com/gzdaijie/p/5202261.html
android提供了大量的UI控件,本文将介绍TextView、ImageView、Button、EditView、ProgressBar、SeekBar、ScrollView、WebView的使用方法。在介绍各种控件之前,先简单介绍android UI控件最基本的几种属性:
TextView可以说是最简单的控件了。
<!--res/layout/activity_main.xml-->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="@+id/text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textSize="30sp"
android:textColor="#334433"
android:text="@string/app_name"
/>
</LinearLayout>
@string/app_name
表示引用资源文件res/values/strings.xml中的app_name,也可以直接写内容。<!--res/values/strings.xml-->
<resources>
<string name="app_name">UIExample</string>
<string name="title_activity_main">MainActivity</string>
</resources>
gravity="right|bottom"
,用 | 隔开text
,与引用类似,多了一个+。 假如上面的样式是标题的样式,且被重复使用多次。如果每个标题都这样定义样式,不但增加工作量,而且会使用修改变得很困难,这种情况下,将style抽象出来能解决这个问题。
这与Web开发中CSS的作用如出一辙。
<!--res/values/styles.xml 增加TextTitle-->
<resources>
...
<style name="TextTitle">
<item name="android:textColor">#334433</item>
<item name="android:textSize">30sp</item>
<item name="android:gravity">center</item>
</style>
</resources>
<!--res/layout/activity_main.xml 将TextView作如下修改即可-->
<TextView
android:id="@+id/text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/app_name"
style="@style/TextTitle"
/>
// 使用代码动态设置TextView中的文本内容
public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// 通过findViewById,获取TextView的实例。
// 使用setText()与getText()赋值和取值。
TextView textView = (TextView) findViewById(R.id.text);
textView.setText("Hello World!");
Log.d("MainActivity",textView.getText().toString());
}
}
有文本,自然少不了图片。
<ImageView
android:id="@+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/test_image"
/>
res/drawable/
目录下即可。// 调用setImageResource()方法即可。
// 需要加载的图片复制到 res/drawable/ 目录下。
ImageView imageView = (ImageView) findViewById(R.id.image);
imageView.setImageResource(R.drawable.test_image2);
<Button
android:id="@+id/button_1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="I Am A Button"
/>
// 第12行,注册监听器OnClickListener,复写onClick()函数。
public class MainActivity extends Activity {
private TextView textView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
textView = (TextView) findViewById(R.id.text);
Button button = (Button) findViewById(R.id.button_1);
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// ... 省略点击事件
// 例如:textView.setText("Hello World");
}
});
}
}
// 第14行,将点击事件绑定到 this
// 第17行,复写接口OnClickListener的onClick()方法
// java中只能继承一个类,接口可以看作java的多继承方式
public class MainActivity extends Activity implements View.OnClickListener{
private TextView textView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
textView = (TextView) findViewById(R.id.text);
Button button = (Button) findViewById(R.id.button_1);
button.setOnClickListener(this);
}
@Override
public void onClick(View view){
// 根据id判断,若一个活动中有多个控件需绑定点击事件
// 使用该方式,该方法简洁直观
switch (view.getId()){
case R.id.button_1:
// ... 省略点击事件
// 例如:textView.setText("Hello World!");
break;
default:
break;
}
}
}
<EditText
android:id="@+id/edit"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:maxLines="3"
android:hint="Please Input..."
/>
placeholder
,用于输入框的提示。// 点击按钮,打印输入的内容。
public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
// ...
Button button = (Button) findViewById(R.id.button_1);
final EditText editText = (EditText) findViewById(R.id.edit);
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// 使用 getText()方法获取editText的内容
String input_text = editText.getText().toString();
Log.d("MainActivity",input_text);
}
});
}
}
<ProgressBar
android:id="@+id/progress_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="gone"
/>
// 一般比较耗时的工作,会暂时显示进度条,工作完成后,进度条消失
// 以下代码模拟该过程
public class MainActivity extends Activity implements View.OnClickListener{
private ProgressBar progressBar;
@Override
protected void onCreate(Bundle savedInstanceState) {
// ...
Button button = (Button) findViewById(R.id.button_1);
progressBar = (ProgressBar) findViewById(R.id.progress_bar);
button.setOnClickListener(this);
}
@Override
public void onClick(View view) {
switch (view.getId()){
case R.id.button_1:
// 点击按钮后,如果当前状态可见,则变为不可见
// 如不可见,则变为可见
if(progressBar.getVisibility() == View.GONE) {
progressBar.setVisibility(View.VISIBLE);
} else {
progressBar.setVisibility(View.GONE);
}
break;
default: break;
}
}
}
<ProgressBar
android:id="@+id/progress_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:max="100"
style="@style/Base.Widget.AppCompat.ProgressBar.Horizontal"
/>
// 将onClick() 改为
@Override
public void onClick(View view) {
switch (view.getId()){
case R.id.button_1:
// 获取当前进度值,每次点击进度值+10
int progress = progressBar.getProgress();
progressBar.setProgress(progress + 10);
default: break;
}
}
<SeekBar
android:id="@+id/seek_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:max="100"
android:progress="50"
/>
<TextView
android:id="@+id/text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
/>
public class MainActivity extends Activity {
private TextView textView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
textView = (TextView) findViewById(R.id.text);
SeekBar seekBar = (SeekBar) findViewById(R.id.seek_bar);
// 设置滑动监听器,复写三个事件函数,分别是值改变、开始滑动、结束滑动
seekBar.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
@Override
public void onProgressChanged(SeekBar seekBar, int progress,
boolean fromUser) {
if(fromUser){
// 用户主动滑动,值改变时触发该事件
textView.setText("用户正在滑动,当前值:" + progress);
}
}
@Override
public void onStartTrackingTouch(SeekBar seekBar) {
Log.d("MainActivity","开始滑动时触发该事件");
}
@Override
public void onStopTrackingTouch(SeekBar seekBar) {
Log.d("MainActivity","结束滑动时触发该事件");
}
});
}
}
<ScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<!-- ... 省略其他控件-->
<TextView
android:id="@+id/text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
</ScrollView>
TextView
的内容过多时(一页显示不完),这时使用ScrollView可以使页面变为可垂直滚动模式
,垂直滚动看完所有内容。<WebView
android:id="@+id/web_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
<manifest ... >
<application ...>
...
</application>
<uses-permission android:name="android.permission.INTERNET"/>
</manifest>
public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
WebView webView = (WebView) findViewById(R.id.web_view);
// 允许执行javasript
webView.getSettings().setJavaScriptEnabled(true);
// 设置代理,复写shouldOverrideUrlLoading函数
webView.setWebViewClient(new WebViewClient(){
@Override
public boolean shouldOverrideUrlLoading(WebView view,String url){
view.loadUrl(url); //加载网页
return true; //true表示使用当前WebView打开网页,不使用系统浏览器
}
});
// 使用webView打开博客园
webView.loadUrl("http://www.cnblogs.com/gzdaijie");
}
}