##常用控件
所有的安卓控件都需要指定 layout_width 和 layout_height
都具有visibility属性
TextView
<TextView
android:id="@+id/txtOne"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text = "我是TextView"
android:gravity = "center"
/>
上面的TextView中有下述几个属性:
android:id 给当前控件定义了一个**唯一**标识符
android:layout_width="match_parent" 让控件的宽度大小和父布局一样
android:layout_height="wrap_content" 让控件的高度大小能够刚好包含里面的内容。
android:text 指定的显示的文本内容
android:gravity 指定文字的对齐方式,可选有top、bottom、left、right、center 等 可以用‘|’来同时指定多个值 例如:top|left
android:textSize="40sp" 指定文字大小
android:textColor="#00ff00" 指定文字颜色
match_parent 填充父布局 由父布局决定控件大小 与 fill_parent含义相同。
wrap_content 含住内容 由控件内容决定控件大小
Button
<Button
android:id="@+id/button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="button"
android:textAllCaps="false"
/>
上面的Button中有下述几个属性:
android:textAllCaps 若不指定则在布局文件中设置的字母始终大写。可以设置为 flase 就可以显示为小写字母
EditText
<EditText
android:id="@+id/et_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="这里是提示信息"
android:maxLines="2"/>
android:hint 提示性文本
android:maxLines 默认的行数是随着文本变化的,设置最大行数可以保证EditText的高度美观。
ImageView
<ImageView
android:id="@+id/image_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/pig"/>
android:src 指定需要显示的图片
也可以通过代码动态的修改图片:
public class MainActivity extends AppCompatActivity {
private ImageView imageView;
private Button button;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
imageView = (ImageView) findViewById(R.id.image_view);
button = (Button) findViewById(R.id.button);
button.setOnClickListener(new View.OnClickListener() {//点击按钮显示图片
@Override
public void onClick(View v) {
imageView.setImageResource(R.drawable.pig);// 设置显示的图片
}
});
}
}
ProgressBar
<ProgressBar
android:id="@+id/progress_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="visible"
style="?android:attr/progressBarStyleHorizontal"
android:max="100"/>
android:visibility 所有的Android控件都具有visibility属性,可以进行设定。如果不指定就都是可见的。 可选值由三种 visible、invisible、gone
- visible表示控件是可见的。
- invisible表示控件是不可见的,但是仍占据原来的位置和大小
- gone表示空间不可见,也不占据任何屏幕空间
style="?android:attr/progressBarStyleHorizontal" 这是进度条为水平进度条
android:max="100" 设置进度条最大值为100
可以通过代码来设置ProgressBar的可见性:
button.setOnClickListener(new View.OnClickListener() {//点击按钮显示进度条
@Override
public void onClick(View v) {
if(progressBar.getVisibility() == View.GONE)
{
progressBar.setVisibility(View.VISIBLE);//设置可见
}else{
progressBar.setVisibility(View.GONE);//设置不可见
}
}
});
静态修改进度条进度
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
int progress = progressBar.getProgress(); //获取当前进度
progress +=10;
progressBar.setProgress(progress);
}
});
每次点击后进度条增长
AlertDialog
AlertDialog可以在当前的页面弹出一个对话框,这个对话框是置顶与所有界面元素之上的,能够屏蔽调其他控件的交互能力,因此,AlertDialog一般用于提示一些非常重要的内容或者警告信息
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
AlertDialog.Builder dialog = new AlertDialog.Builder(MainActivity.this);
dialog.setCancelable(false); //设置不能点击返回键取消
dialog.setTitle("这是一个提示框");
dialog.setMessage("具体提示的一些信息");
dialog.setPositiveButton("是", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
//执行的一些逻辑
}
});
dialog.setNegativeButton("否", new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
//执行的一些逻辑
}
});
dialog.show();
}
});
ProgressDialog
与AlertDialog有些类似。都可以在界面上弹出一个对话框。不同的是ProgressDialog会在对话框中显示一个进度条。用法与AlertDialog类似。
4种基本布局
LinearLayout 线性布局
LinearLayout是一种常用的布局。 他会将所包含的控件在现行方向上依次排列。可以设置
android:orientation="vertical" 垂直排列
或
android:orientation="horizontal" 水平排列, 这是默认值
可以在布局内部的空间中设置 android:layout_gravity 属性来指定控件相对于布局的位置
在LinearLayout中 允许我们使用比例的方式来指定控件的宽度大小。
<EditText
android:id="@+id/et_text"
android:layout_width="match_parent"
android:layout_weight="1"
android:layout_height="wrap_content"
android:hint="这里是提示信息"
android:maxLines="2"/>
<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="button"
android:textAllCaps="false"
/>
这里制定了EditText的layout_weight属性,将Button的宽度设置为wrap_content EditText会沾满屏幕的剩余空间
RelativeLayout 相对布局
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<Button
android:id="@+id/button1"
android:text="button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"/>
<!--位于布局的左上-->
<Button
android:id="@+id/button2"
android:text="button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true" />
<!--位于布局的右上/>-->
<Button
android:id="@+id/button3"
android:text="button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"/>
<!--位于布局的正中心-->
<Button
android:id="@+id/button4"
android:text="button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentBottom="true"/>
<!--位于布局的左下-->
<Button
android:id="@+id/button5"
android:text="button5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"/>
<!--位于布局的右下-->
<Button
android:id="@+id/button6"
android:text="button6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@id/button3"
android:layout_toLeftOf="@id/button3"/>
<Button
android:id="@+id/button7"
android:text="button7"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@id/button3"
android:layout_toRightOf="@id/button3"/>
<Button
android:id="@+id/button8"
android:text="button8"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/button3"
android:layout_toLeftOf="@id/button3"/>
<Button
android:id="@+id/button9"
android:text="button9"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@id/button3"
android:layout_toRightOf="@id/button3"/>
</RelativeLayout>
layout_above 表示让这个控件位于指定控件的上方
layout_below 表示让这个控件位于指定控件的下方
layout_toLeftOf 表示让这个控件位于指定控件左方
layout_toRightOf 表示让这个控件在指定控件右方
layout_alignParentTop 表示让这个控件在父布局中的上方
layout_alignParentBottom 表示让这个控件在父布局中的下方
layout_alignParentLeft 表示让这个控件在父布局中的左方
layout_alignParentRight 表示让这个控件在父布局中的右方
layout_alignLeft 表示让这个控件和另一个控件的左边缘对齐
layout_alignRight 表示让这个控件和另一个控件的右边缘对齐
layout_alignTop 表示让这个控件和另一个控件的上边缘对齐
layout_alignBottom 表示让这个控件和另一个控件的下边缘对齐
FrameLayout 帧布局
在FrameLayout布局模式下, 所有的控件都会默认摆放在布局的左上角
呈现出重叠的效果。
可以使用layout_gravity属性来指定空间在布局中的对齐方式
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="match_parent"
android:layout_width="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:text="吧啦吧啦"/>
<Button
android:text="小按钮"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"/>
</FrameLayout>
PercentFrameLayout 百分比布局
-
需要在app/build.gradle中的的dependencies闭包中添加如下内容:
implementation ‘com.android.support:percent:26.0.0-alpha1‘
-
修改布局文件
<android.support.percent.PercentFrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto" > <Button android:id="@+id/button1" android:text="button1" android:layout_gravity="left|top" app:layout_widthPercent="50%" app:layout_heightPercent="50%" /> <Button android:id="@+id/button2" android:text="button2" android:layout_gravity="right|top" app:layout_widthPercent="50%" app:layout_heightPercent="50%" /> <Button android:id="@+id/button3" android:text="button3" android:layout_gravity="left|bottom" app:layout_widthPercent="50%" app:layout_heightPercent="50%" /> <Button android:id="@+id/button4" android:text="button4" android:layout_gravity="right|bottom" app:layout_widthPercent="50%" app:layout_heightPercent="50%" /> </android.support.percent.PercentFrameLayout>
由于百分比布局并不是内置在系统SDK当中的,所以需要写出完整的包的路径还必须定义一个app的命名空间
其中 xmlns:app="http://schemas.android.com/apk/res-auto" 是app的命名空间
app:layout_widthPercent 将各个按钮的宽度指定为布局的50%
借助layout_gravity来分别将这个4个按钮放置在布局的各个位置。
自定义控件
所有的控件都是直接或者简介继承自View的,
所有布局都是直接或简介继承自ViewGroup的。
自定义布局
自定义布局需要引入一个布局
-
新建一个布局 起名为title.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="wrap_content"> <Button android:id="@+id/title_back" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:layout_margin="5dp" android:text="返回" /> <TextView android:layout_width="0dp" android:layout_height="wrap_content" android:layout_gravity="center" android:gravity="center" android:layout_margin="5dp" android:layout_weight="1" android:textSize="24sp" android:text="标题" /> <Button android:id="@+id/title_edit" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="5dp" android:layout_gravity="center" android:text="编辑" /> </LinearLayout>
-
然后在需要引用的布局中加入
<include layout="@layout/title" />
-
在MainActivity.java中把系统自带的标题栏隐藏掉
protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); ActionBar actionbar = getSupportActionBar(); if(actionbar != null) actionbar.hide(); }
自定义控件
1.新建一个TitleLayout 继承LinearLayout
public class TitleLayout extends LinearLayout {
public TitleLayout(Context context, AttributeSet attrs) {
super(context, attrs);
LayoutInflater.from(context).inflate(R.layout.title, this);
}
}
重写了LinearLayout中带有两个参数的构造函数,通过LayoutInflater的from()方法可以构建出一个LayoutInflater对象,然后调用inflate()方法就可以动态加载一个布局文件, inflate()方法需要传入两个参数第一个参数是需要加载的布局文件的ID 第二个参数是给加载好的布局文件添加一个父布局。
-
在布局文件中修改如下
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="match_parent"> <!--完整类名--> <cn.zbuter.myapplication.TitleLayout android:layout_height="wrap_content" android:layout_width="match_parent" /> </LinearLayout>
3.添加按钮监听。
public class TitleLayout extends LinearLayout {
public TitleLayout(Context context, AttributeSet attrs) {
super(context, attrs);
LayoutInflater.from(context).inflate(R.layout.title, this);
Button titleBack = (Button) findViewById(R.id.title_back);
Button titleEdit = (Button) findViewById(R.id.title_edit);
titleBack.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
((Activity)getContext()).finish();
}
});
titleEdit.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(getContext(), "你点击了编辑", Toast.LENGTH_SHORT).show();
}
});
}
}
ListView
简单用法:
-
在activity的布局文件中加入ListView控件
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"><ListView android:id="@+id/list_view" android:layout_width="match_parent" android:layout_height="match_parent" />
-
在java文件中修改
public class MainActivity extends AppCompatActivity { //需要展示的数据 private String[] data = {"Apple", "Banana", "Orange", "Watermelon","Pear"}; protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); ArrayAdapter<String> adapeter = new ArrayAdapter<String>(MainActivity.this,R.layout.support_simple_spinner_dropdown_item,data); ListView listView = (ListView) findViewById(R.id.list_view); //设置ListView的适配器 listView.setAdapter(adapeter); } }
定制ListView的界面
-
定义一个实体类,作为ListView适配器的适配类型,新建一个名为Fruit的类
public class Fruit { private String name; private int imageId; public Fruit(String name, int imageId){ this.name = name ; this.imageId = imageId; } public int getImageId() { return imageId; } public String getName() { return name; } }
-
为ListView的子项指定一个自定义的布局。 在layout目录下新建fruit_item.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="match_parent"> <ImageView android:id="@+id/fruit_image" android:layout_width="wrap_content" android:layout_height="wrap_content" /> <TextView android:id="@+id/fruit_name" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="10dp" android:layout_gravity="center_vertical" /> </LinearLayout>
-
创建自定义适配器继承ArrayAdapter 并将泛型指定为Fruit
public class FruitAdapter extends ArrayAdapter<Fruit> { private int resourceId; public FruitAdapter(Context context, int resource, List<Fruit> objects) { super(context, resource, objects); this.resourceId = resource; } //在每个子项被滚动到屏幕内的时候会被调用这个方法 public View getView(int position, View convertView, ViewGroup parent) { Fruit fruit = getItem(position); //获取当前项的Fruit实例 View view = LayoutInflater.from(getContext()).inflate(resourceId,parent,false); // 为子项加载我们传入的布局 ImageView fruit_image = (ImageView) view.findViewById(R.id.fruit_image); TextView fruit_name = (TextView) view.findViewById(R.id.fruit_name); fruit_image.setImageResource(fruit.getImageId()); fruit_name.setText(fruit.getName()); return view; } }
修改MainActivity代码