[移动开发]Android学习笔记：UI-控件与布局

1.View类的常用属性:
android:id设置控件的标识符号
android:layout_width设置子组件的布局宽度
android:layout_height设置子组件的布局高度
android:background设置控件的背景色
android:onClick设置控件的单击事件绑定监听器
android:visibility设置控件是否可见
android:alpha设置控件透明度（0-1之间的数值）
android:padding设置子组件的内边距
android:layout_margin设置子组件的外边距
android:onClick为控件设置点击事件对应的回调方法
android:layout_width
android:layout_heigh
2.TextView

<TextView
        android:id="@+id/text_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:textSize="24sp"
        android:textColor="#00ff00"
        android:text="This is TextView"/>
  <!--match_parent/file_parent:和父布局一样 wrap_content:刚好适配内容
    gravity="center"=center_vertical|center_horizontal;top\bottom\left\right\center
    android:textSize="24sp"//指定大小
    android:textColor="#00ff00"//指定颜色
    -->

3.Button

<Button
        android:id="@+id/button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Button"
        android:textAllCaps="false"/>
   <!--android:textAllCaps="false"显示不转换大小写-->

4.EditText类继承自TextView类，具有TextView的所有属性，不同就是用户可以对EditText控件进行编辑，同时还可以为EditText控件设置监听器，用来判断用户的输入是否合法。

<EditText
        android:id="@+id/edit_text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="Type something here"
        android:maxLines="2"/>最大行数为2行

<EditText
        android:id="@+id/edit_text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="Type something here"/>输入提示

Button button=(Button) findViewById(R.id.button);
        EditText editText=(EditText) findViewById(R.id.edit_text);
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                switch (v.getId()){
                    case R.id.button:
                        String inputText=editText.getText().toString();
                        Toast.makeText(MainActivity.this,inputText,Toast.LENGTH_SHORT).show();
                        break;
                    default:
                        break;
                }
            }
        });

5.ImageView

<ImageView
        android:id="@+id/image_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/img_1"/>

ImageView imageView=(ImageView) findViewById(R.id.image_view) ;
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                switch (v.getId()){
                    case R.id.button:
                        imageView.setImageResource(R.drawable.img_2);
                        break;
                    default:
                        break;
                }
            }
        });

5.ProgressBar
进度条，就是平时下载东西常见到表示下载进度的控件。需要在Activity对应的Xml文件中对ProgressBar进行布局和样式的设定。
android:visibility设置控件是否可见

<ProgressBar
        android:id="@+id/progress_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

ProgressBar progressBar =(ProgressBar) findViewById(R.id.progress_bar);
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                switch (v.getId()){
                    case R.id.button:                   
                        /*
                        setVisibility(View.VISIBLE)可见
                        setVisibility(View.INVISIBLE)不可见
                        setVisibility(View.GONE)不可见且不占用屏幕空间
                        */
                        if(progressBar.getVisibility()==View.GONE){
                            progressBar.setVisibility(View.VISIBLE);
                        }else {
                            progressBar.setVisibility(View.GONE);
                        }
                        break;
                    default:
                        break;
                }
            }
        });

6.水平进度条

<ProgressBar
...
style="?android:attr/progressBarStyleHorizontal"
 android:max="100"/>

每点击一次按钮，进度条加10

ProgressBar progressBar =(ProgressBar) findViewById(R.id.progress_bar);
button.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        switch (v.getId()){
            case R.id.button:
                int progress=progressBar.getProgress();
                progress=progress+10;
                progressBar.setProgress(progress);
                break;
            default:
                break;
        }
    }
});

7.AlterDialog
Toast用来显示提示内容，而AlterDialog是警告框，上面可以有一些控件，比如按钮等。初始化AlterDialog并且进行显示:

button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                switch (v.getId()){
                    case R.id.button:
                        AlertDialog.Builder dialog=new AlertDialog.Builder(MainActivity.this);
                        //通过AlertDialog.Builder创建一个AlertDialog实例，设置标题、内容、可否取消，
                        // setPositiveButton（）设置确定按钮的点击事件，
                        //setNegativeButton（）设置取消按钮的点击事件
                        //show()将对话框显示
                        dialog.setTitle("This is Dialog");
                        dialog.setMessage("Something important");
                        dialog.setCancelable(false);
                        dialog.setPositiveButton("ok", new DialogInterface.OnClickListener() {
                            @Override
                            public void onClick(DialogInterface dialog, int which) {
                            }
                        });
                        dialog.setNegativeButton("cancel", new DialogInterface.OnClickListener() {
                            @Override
                            public void onClick(DialogInterface dialog, int which) {
                            }
                        });
                        dialog.show();
                        break;
                    default:
                        break;
                }
            }
        });

（1）AlterDialog通过AlterDialog的Builder进行创建，在创建的时候会指定该AlterDialog在那个Activity上进行显示。
（2）通过setTitle方法给AlterDialog设置标题，通过setMessage给AlterDialog设置内容。
（3）setCancelable()方法，我们在这儿设置的时false，表示弹出的AlterDialog在用户点击返回键是不消失，该值默认是true。
（4）setPositiveButton()方法是设置点击“确定”按钮时的事件, setNegativeButton是设置点击“取消”按钮的事件。通过Toast来展示事件的点击。

8.ProgressDialog(进度提示框)
在AlterDialog上添加Progress
setCancelable(false);//不能back取消，当数据加载完必须调用ProgressDialog的dismiss()方法来关闭对话框，否则ProgressDialog一直存在。

9.四大布局方式线性布局（LinearLayout）、相对布局（RelativeLayout）、帧布局（FrameLayout）、表格布局(TableLayout)

10.LinearLayout (线性布局)
通过android:orientation属性来设置是水平（horizontal）线性排列还是垂直（vertical）线性排列

   <LinearLayout xmls:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
 <Button
        android:layout_gravity="top"/>
布局为horizontal，控件应该在垂直vertical上layout_gravity，
top,center_vertical，bottom顶端、中间、底部
<Button
 android:layout_weight="1"/>
<Button
 android:layout_weight="1"/>
水平方向平分宽度
<Button
 android:layout_weight="2"/>
<Button
 android:layout_weight="3"/>
水平方向2/5、3/5宽度
注：layout_weight只有LinearLayout实现
</LinearLayout>

11.RelativeLayout (相对布局)
相对布局可以根据已经固定的控件来确定其他新加控件的位置。

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <Button
//相对于父布局左上边
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
//相对于父布局右上边
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true" 
//相对于父布局中
        android:layout_centerInParent="true"
//相对于父布局左下边
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
//相对于父布局右上边
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
</RelativeLayout>

相对于控件：button3

android:layout_toRightOf="@+id/button3"
android:layout_toLiftOf="@+id/button3"
android:layout_above="@id/button3"
android:layout_below="@id/button3"

相对于控件边缘对齐：

android:layout_alignLeft="@id/button3"
android:layout_alignRight="@id/button3"
android:layout_alignTop="@id/button3"
android:layout_alignBottom="@id/button3"

layout_margin在上下左右方向上偏移，layout_marginLeft向左偏移
12.帧布局 (FrameLayout)
左上角的位置

13.百分比布局

14.自定义布局
自定义title.xml
使用：<include layout="@layout/title"/>
隐藏标题栏

ActionBar actionBar=getSupportActionBar();
        if(actionBar!=null){
            actionBar.hide();
        }

为布局添加动态加载：LayoutInflater来实现

public class TitleLayout extends LinearLayout {
    public TitleLayout(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        LayoutInflater.from(context).inflate(R.layout.title, this);
        //对标题栏布局进行动态加载， LayoutInflater来实现，
        //通过from方法可以构建一个LayoutInflater对象，
        //inflate方法动态加载一个布局文件（加载的布局文件的id,给加载的布局添加一个父布局）
        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 view) {
                ((Activity) getContext()).finish();
            }
        });
        titleEdit.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View view) {
                Toast.makeText(getContext(),"You clicked Edit button",Toast.LENGTH_SHORT).show();
            }
        });
    }
}

15.ListView显示大量数据

 <ListView
        android:id="@+id/list_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

public class MainActivity extends AppCompatActivity {
    private String[] data = { "Apple", "Banana", "Orange", "Watermelon", "Pear",
            "Grape", "Pineapple", "Strawberry", "Cherry", "Mango", "Apple",
            "Banana", "Orange", "Watermelon", "Pear", "Grape", "Pineapple",
            "Strawberry", "Cherry", "Mango" };
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //数组中的数据是无法直接传递给ListView的，还需要借助适配器来完成，Android中提供了很多适配器的实现类，其中常用的就是ArrayAdapter
        // ArrayAdapter可以通过泛型来指定要适配的数据类型，然后在构造函数中把要适配的数据传入。
        // ArrayAdapter有多个构造函数的重载，根据实际情况选择最合适的一种。
        // 构建适配器对象，在ArrayAdapter的构造函数中依次传入当前上下文、 ListView子项布局的id，以及要适配的数据。
        // android.R.layout.simple_list_item_1 作为ListView子项布局的id，这是一个Android 内置的布局文件，里面只有一个TextView，可用于简单地显示一段文本。
        ArrayAdapter<String> adapter=new ArrayAdapter<String>(MainActivity.this, android.R.layout.simple_list_item_1,data);
        ListView listView=(ListView) findViewById(R.id.list_view); 
        // 最后调用ListView的setAdapter() 方法，将构建好的适配器对象传递进去，这样 ListView和数据之间的关联就建立完成了。
        listView.setAdapter(adapter);
    }
}

16.定制ListView
Fruit类：

package com.example.listviewtest;

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;
    }
}

FruitAdapter适配器定制：

public class FruitAdapter extends ArrayAdapter <Fruit>{
    private int resourceId;
    //构造方法，将上下文、子项布局id、数据传进来
    public FruitAdapter(Context context, int textViewResourceId, List<Fruit> objects){
        super(context, textViewResourceId, objects);
        resourceId = textViewResourceId;
    }
    @Override
    //重写getView方法，这个方法在每个子项被滚动到屏幕内的时候会被调用
    public View getView(int position, View convertView, ViewGroup parent) {
        Fruit fruit = getItem(position);//获取当前项的Fruit实例
        //用LayoutInflater 来为这个子项加载我们传入的布局。
        // 对布局进行动态加载， LayoutInflater来实现，
        // 通过from方法可以构建一个LayoutInflater对象，inflate方法动态加载一个布局文件（加载的布局文件的id,给加载的布局添加一个父布局）
        View view = LayoutInflater.from(getContext()).inflate(resourceId,parent,false);
        ImageView fruitImage = (ImageView) view.findViewById(R.id.fruit_image);
        TextView fruitName = (TextView) view.findViewById(R.id.fruit_name);
        //设置显示的图片和文字
        fruitImage.setImageResource(fruit.getImageId());
        fruitName.setText(fruit.getName());
        return view;
    }
}

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(); // 初始化水果数据
        FruitAdapter adapter = new FruitAdapter( MainActivity.this,
                R.layout.fruit_item, fruitList);
        ListView listView = (ListView) findViewById(R.id.list_view);
        listView.setAdapter(adapter);
    }

    private void initFruits() {
        //创建水果实例，并添加到水果实例列表
        for (int i = 0; i < 5; 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);
            Fruit orange = new Fruit("Orange", R.drawable.orange_pic);
            fruitList.add(orange);
            Fruit  watermelon= new Fruit("Watermelon", R.drawable.watermelon_pic);
            fruitList.add(watermelon);
            Fruit pear = new Fruit("Pear", R.drawable.pear_pic);
            fruitList.add(pear );
            Fruit grape = new Fruit("grape", R.drawable.grape_pic);
            fruitList.add(grape);
            Fruit pineapple = new Fruit("Pineapple", R.drawable.pineapple_pic);
            fruitList.add(pineapple);
            Fruit strawberry = new Fruit("Strawberry", R.drawable.strawberry_pic);
            fruitList.add(strawberry);
            Fruit cherry = new Fruit("Cherry", R.drawable.cherry_pic);
            fruitList.add(cherry);
            Fruit mango = new Fruit("Mango", R.drawable.mango_pic);
            fruitList.add(mango);
        }
    }

}

17.优化

public class FruitAdapter extends ArrayAdapter <Fruit>{
    private int resourceId;
    //构造方法，将上下文、子项布局id、数据传进来
    public FruitAdapter(Context context, int textViewResourceId, List<Fruit> objects){
        super(context, textViewResourceId, objects);
        resourceId = textViewResourceId;
    }
    @Override
    public View getView(int position,  View convertView, ViewGroup parent) {
        Fruit fruit = getItem(position);//获取当前项的Fruit实例
        View view;
        ViewHolder viewHolder;
        // convertView用于将之前加载好的布局进行缓存
        if (convertView == 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存储在View中
        }else {
            view = convertView;
            viewHolder=(ViewHolder) view.getTag();//重新获取对象
        }
        viewHolder.fruitImage.setImageResource(fruit.getImageId());
        viewHolder.fruitName.setText(fruit.getName());
        return view;
    }
    // 新增一个内部类，用于对控件的实例进行缓存
    class ViewHolder{
        ImageView fruitImage;
        TextView fruitName;
    }
}

18.ListView设置监听：

listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> adapterView, View view, int position, long id) {
                Fruit fruit=fruitList.get(position);
                Toast.makeText(MainActivity.this,fruit.getName(),Toast.LENGTH_SHORT).show();
            }
        });
    }
}