1. 基础UI控件
Android中的基础UI控件有这样几种：
TextViewButtonEditTextImageViewProgressBarAlertDialogListViewRecylerView
1.1 TextView
TextView可谓是最简单的UI控件了，它主要用于文字的展示。它的代码如下: 最基本的就需要指定layout_width和layout_height就可以了
<TextView
android:id="@+id/edit_view"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center" />
然而，想要玩的高级，仅仅掌握基础的用法可不行，这儿我从静态属性和动态方法两个方面总结了TextView的用法。
XML属性：
| 功能 | 用法 |
|---|---|
| 设置文字颜色 | android:textColor="#000" |
| 设置文字大小 | android:textSize="20sp" |
| 设置控件位置 | android:gravity="center" |
| 设置背景颜色 | android:background="#FFF" |
| 设置文字链接 | android:autoLink="web" |
| 设置文字单行显示 | android:singleLine="true" |
| 设置最大行数 |
android:maxLines="2" android:ellipsize="end"
|
动态方法：
| 功能 | 用法 |
|---|---|
| 设置文字内容 | textView.setText(); |
| 设置文字大小 | textView.setTextSize(TypedValue.COMPLEX_UNIT_SP, 16); |
| 加粗 | textView.setTypeface(Typeface.defaultFromStyle(Typeface.BOLD)); |
1.2 Button
Button在英文中是按钮的意思，它一般用作接受用户的点击操作。
一般注册点击事件有两种方式：
1. 匿名类
Button button2 = findViewById(R.id.button2);
button2.setOnClickListener(new View.OnClickListener(){
@Override
public void onClick(View view) {
...
...
}
}
2.实现接口
public class SecondActivity extends AppCompatActivity implements View.OnClickListener{
Button button = findViewById(R.id.button_2);
button.setOnClickListener(this);
//实现接口的方式
@Override
public void onClick(View view) {
switch (view.getId()){
case R.id.button_2:
break;
default:
break;
}
}
}
button需要注意的是，它的文字默认都是大写的，如果要取消这一设定，可以设置android:textAllCaps="false"
1.3 EditText
EditText是程序用于和用户进行交互的另一个重要控件，它允许用户在控件里输入和编辑内容，并可以在程序中对这些内容进行处理
EditText
我们还是从静态属性和动态方法来总结这个控件
XML属性：
| 功能 | 用法 |
|---|---|
| 设置提醒文字 | android:hint=“Please input your name” |
动态方法：
| 功能 | 用法 |
|---|---|
| 设置文字内容 | EditText.setText(); |
| 获取文字内容 | EditText.getText().toString(); |
1.4 ImageView
顾名思义，ImageView就是用来放图片的控件
XML属性：
| 功能 | 用法 |
|---|---|
| 设置图片 | android:src=“@drawable/img_1” |
动态方法：
| 功能 | 用法 |
|---|---|
| 设置图片 | imageView.setImageResource(R.drawable.img_2); |
1.5 ProgressBar
ProgressBar用于在界面上显示一个进度条，表示我们的程序正在加载一些数据。
button1.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
//如果不可见就将progressBar显示出来
//如果可见就隐藏
if(progressBar.getVisibility() == View.GONE){
progressBar.setVisibility(View.VISIBLE);
}
else progressBar.setVisibility(View.GONE);
XML属性：
| 功能 | 用法 |
|---|---|
| 设置样式（直线进度条） |
style = "?android:attr/progressBarStyleHorizontal" android:max=100
|
动态方法：
| 功能 | 用法 |
|---|---|
| 设置可见度 | progressBar.setVisibility(View.VISIBLE); |
| 获取可见度 | progressBar.getVisibility(); |
| 设置进度 | progressBar.setProgress(progress); |
| 获取进度 | progressBar.getProgress(); |
ProgressBar
1.6 AlertDialog
AlertDialog可以在当前的界面弹出一个对话框，这个对话框是置顶于所有界面元素之上的，能够屏蔽掉其他控件的交互能力，因此AlertDialog一般用于提示一些非常重要的内容或者警告信息。
它的静态属性和动态方法如下
动态方法：
| 功能 | 用法 |
|---|---|
| 获取实例 | AlertDialog.Builder dialog = new AlertDialog.Builder(FirstActivity.this); |
| 设置标题 | dialog.setTitle("This is a dialog") |
| 设置信息 | dialog.setMessage("Something Important") |
| 设置取消 | dialog.setCancelable(false); |
| 设置正键 | dialog.setPositiveButton("OK", new DialogInterface.OnClickListener() {}) |
| 设置负键 | dialog.setNegativeButton("OK", new DialogInterface.OnClickListener() {}) |
button1.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
AlertDialog.Builder dialog = new AlertDialog.Builder(FirstActivity.this);
dialog.setTitle("This is a dialog"); //弹出框标题
dialog.setMessage("Something Important"); //弹出框信息
dialog.setCancelable(false); //点击其他地方可以让对话框消失 //弹出框取消
dialog.setPositiveButton("OK", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialogInterface, int i) {
}
});
dialog.setNegativeButton("Resume", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialogInterface, int i) {
dialogInterface.dismiss();
}
});
dialog.show();
}
});
效果如下：
AlertDialog
1.6 ProgressDialog
ProgressBar的功能和AlertDialog类似，都可以在界面上弹出一个对话框，都能够屏蔽掉其他控件的交互能力。不同的是，ProgressDialog会在对话框中显示一个进度条，一般用于表示当前的耗时操作。
动态方法：
| 功能 | 用法 |
|---|---|
| 获取实例 | ProgressbarDialog progressDialog = new ProgressDialog(MainActivity.this); |
| 设置标题 | progressDialog.setTitle("This is a ProgressDialog"); |
| 设置信息 | progressDialog.setMessage("Loading..."); |
| 关闭ProgressBar | progressBar.dismiss(); |
ProgressbarDialog progressDialog = new ProgressDialog(MainActivity.this);
progressDialog.setTitle("This is a ProgressDialog");
progressDialog.setMessage("Loading...");
progressDialog.setCancelable(true);
progressDialog.show();
//...(当数据加载完）
//...(当数据加载完）
progressBar.dismiss() ;//关掉progressBar
2. 进阶UI控件
2.1 ListView
1. ListView基础用法
- 定义
ListView
<ListView
android:id="@+id/list_view"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
- 定义适配器
ArrayAdapter<String> adapter = new ArrayAdapter<String>(FirstActivity.this,android.R.layout.simple_list_item_1,data);
//data是自己定义的数据，必须要是String类型
- 设置适配器
listView.setAdapter(adapter);
2. 自定义ListView画面
- 自定义类
public class Fruit(){
private String name;
private int imageId;
public Fruit(String name, int imageId){
this.name = name;
this.imageId = imageId;
}
public String getName(){
return name;
}
public int getimageId() {
return imageId;
}
}
-
自定义子项
自定义子项xml -
自定义Adapter
-
FruitAdapter构造函数
private int resourceId;
public FruitAdapter(Context context, int textViewResourceId, List<Fruit> objects){
super(context, textViewResourceId, objects);
resourceId = textViewResourceId; //resourceId 用在后面的inflate中，是子项布局的Id所在
}
- 获取当前Fruit实例(
getView)
Fruit fruit = getItem(position); //BaseAdapter.getItem()用来获得某一位置得到的对象实例
- 获取当前控件实例(
getView) - 设置当前控件的内容(
getView)
3. ListView优化方法
-
convertView
convertView用于将之前加载好的布局进行缓存，以便之后可以进行重用。
View view;
if (converView == null){
view = LayoutInflater.from(getContext()).inflate(resourceId, parent, false);
} else {
view = convertView;
}
ViewHolder
getView(......){
ViewHolder viewHolder
if(converView == null){
view = LayoutInflater.from(getContext()).inflate(resourceId, parent, false);
viewHolder = new ViewHolder();
viewHolder.fruitImage = (ImageView) view.findViewById(R.id.fruit_image);
viewHolder.fruitName= (TextView) view.findViewById(R.id.fruit_name);
view.setTag(viewHolder); //将viewHolder这个存入进去，保存两个控件实例
} else {
view = convertView;
viewHolder = (ViewHolder) view.getTag();
}
viewHolder.fruitImage.setImage....
viewHolder.fruitName.setText....
class ViewHolder {
ImageView fruitImage;
TextView fruitName;
}
}
4. ListView点击事件
listView.setOnItemClickListener(new AdapterView.OnItemClickListener(0{
@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id){
Fruit fruit = fruitList.get(position);
Toast..........
}
})
2.2 RecyclerView
1. RecyclerView的基本用法
implementation 'androidx.recyclerview:recyclerview:1.0.0'
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
public class FruitAdapter extends RecyclerView.Adapter<FruitAdapter.ViewHolder> {
private List<Fruit> mFruitList;
static class ViewHolder extends RecyclerView.ViewHolder {
View fruitView;
ImageView fruitImage;
TextView fruitName;
public ViewHolder(View view) {
super(view);
fruitView = view;
fruitImage = view.findViewById(R.id.fruit_image);
fruitName = view.findViewById(R.id.fruit_name);
}
}
@NonNull
@Override
public ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
View view = LayoutInflater.from(parent.getContext())
.inflate(R.layout.fruit_item, parent, false);
final ViewHolder holder = new ViewHolder(view);
holder.fruitView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
int position = holder.getAdapterPosition();
Fruit fruit = mFruitList.get(position);
Toast.makeText(view.getContext(), "你点击了View"+ fruit.getName(), Toast.LENGTH_SHORT).show();
}
});
holder.fruitImage.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
int position = holder.getAdapterPosition();
Fruit fruit = mFruitList.get(position);
Toast.makeText(view.getContext(), "你点击了图片"+ fruit.getName(), Toast.LENGTH_SHORT).show();
}
});
return holder;
}
@Override
public void onBindViewHolder(@NonNull ViewHolder holder, int position) {
Fruit fruit = mFruitList.get(position);
holder.fruitImage.setImageResource(fruit.getImageId());
holder.fruitName.setText(fruit.getName());
}
@Override
public int getItemCount() {
return mFruitList.size();
}
public FruitAdapter(List<Fruit> fruitList) {
mFruitList = fruitList;
}
}
public class MainActivity extends AppCompatActivity {
private List<Fruit> fruitList = new ArrayList<>();
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initFruits();
RecyclerView recyclerView = findViewById(R.id.recycler_view);
LinearLayoutManager layoutManager= new LinearLayoutManager(this);
recyclerView.setLayoutManager(layoutManager);
FruitAdapter adapter = new FruitAdapter(fruitList);
recyclerView.setAdapter(adapter);
}
private void initFruits() {
for(int i = 0; i < 10; i++) {
Fruit apple = new Fruit("Apple", R.drawable.apple_pic);
fruitList.add(apple);
Fruit banana = new Fruit("banana", R.drawable.banana_pic);
fruitList.add(banana);
}
}
}
2. 横向滚动
layoutManager.setOrientation(LinearLayoutManagert.HROIZONTAL);
3. 瀑布流
StaggeredGridLayoutManager layoutManager = new StaggeredGridLayoutManager(3, StaggeredGridLayoutManager.VERITICAL)
recyclerView.setLayoutManager(layoutManager);
其中，第一个参数3代表将布局分为3列，第二个参数指定布局的排列方向
4. 点击事件
RecyclerView的点击事件会相比于ListView更加复杂一些,大概思路是在ViewHolder函数中，对 holder中的控件进行事件绑定
@Override
public void onClick(View view) {
int position = holder.getAdapterPosition();
Fruit fruit = mFruitList.get(position);
Toast.makeText(view.getContext(), "你点击了View"+ fruit.getName(), Toast.LENGTH_SHORT).show();
}
});
holder.fruitImage.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
int position = holder.getAdapterPosition();
Fruit fruit = mFruitList.get(position);
Toast.makeText(view.getContext(), "你点击了图片"+ fruit.getName(), Toast.LENGTH_SHORT).show();
2.3 自定义控件
1. 引入布局
步骤：
- 创建XML布局文件
- 引入布局文件
<include layout="@layout/title" />
2. 创建自定义控件
上述只能单纯引入布局，而不能引入控件及控件的事件，因此我们可以采用创建自定义控件的方式
步骤：
- 创建XML布局文件
- 引入布局文件
<com.example.uicustomviews.TitleLayout
android:layout_width="match_parent"
android:layout_height="wrap_content'/>
3.编写TitleLayout类(extends LinearLayout)
在这里就可以实现这个布局的具体事件了，注意可以用getActivity()来获取Activity对象
网友评论