Android学习——UI基础组件二

Android基础组件

1.Spinner下拉列表框

静态:

<Spinner
        android:id="@+id/spinner"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:entries="@array/city"/>

在res/values/strings.xml文件中设置列表内容

<array name="city">
        <item>北京</item>
        <item>上海</item>
        <item>广州</item>
        <item>天津</item>
        <item>温州</item>
        <item>宁波</item>
    </array>

在这里插入图片描述
动态:

<Spinner
        android:id="@+id/spinner_role"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_below="@id/spinner"/>
 private Spinner spinner_role;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main2);

        spinner_role=findViewById(R.id.spinner_role);

        String[] roles = {"管理员","VIP会员","普通会员","游客"};
        //方式一
        //这是用来创建一个数组适配器(上下文,下拉列表里的布局文件,显示下拉选项的组件ID,数据)
        ArrayAdapter<String> adapter=new ArrayAdapter<String>(this,android.R.layout.simple_dropdown_item_1line,android.R.id.text1,roles);
        //方式二(上下文,数据,布局)
        ArrayAdapter adapter1=ArrayAdapter.createFromResource(this,R.array.city,android.R.layout.simple_spinner_dropdown_item);
        adapter1.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
        //通过适配器进行数据的绑定
        spinner_role.setAdapter(adapter1);

在这里插入图片描述
在这里插入图片描述

AutoCompleteTextView

为客户提供建议,自动匹配
completionThreshold输入几个字符开始提示

<AutoCompleteTextView
        android:id="@+id/autoCompleteTextView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_alignParentEnd="true"
        android:layout_alignParentRight="true"
        android:text="AutoCompleteTextView"
        android:completionThreshold="1"/>

在res中新建一个资源文件

<array name="city_name">
        <item>北京</item>
        <item>上海</item>
        <item>广州</item>
        <item>天津</item>
        <item>温州</item>
        <item>宁波</item>
    </array>
private AutoCompleteTextView autoCompleteTextView;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main2);

        autoCompleteTextView=findViewById(R.id.autoCompleteTextView);

        ArrayAdapter adapter=ArrayAdapter.createFromResource(this,R.array.city_name,android.R.layout.simple_dropdown_item_1line);
        autoCompleteTextView.setAdapter(adapter);

在这里插入图片描述

ProgressBar(进度条)

1.ProgressBar基本属性的使用
在这里插入图片描述

<ProgressBar
        android:id="@+id/progressBar"
        style="?android:attr/progressBarStyleLarge"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"/>

    <ProgressBar
        android:id="@+id/progressBar2"
        style="?android:attr/progressBarStyle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_below="@id/progressBar"/>

    <ProgressBar
        android:id="@+id/progressBar3"
        style="?android:attr/progressBarStyleSmall"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_below="@id/progressBar2"/>

在这里插入图片描述
indeterminate(不确定)横向进度条是否确定值,为true,不确定值

<ProgressBar
        android:id="@+id/progressBar4"
        style="?android:attr/progressBarStyleHorizontal"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentEnd="true"
        android:layout_alignParentRight="true"
        android:layout_below="@id/progressBar3"
        android:max="100"
        android:progress="50"
        android:secondaryProgress="80"
        android:indeterminate="true"/>

在这里插入图片描述
2.ProgressBar对话框与标题进度条
点击按钮,出现对话框进度条

<Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_below="@id/progressBar4"
        android:layout_alignParentEnd="true"
        android:layout_alignParentRight="true"
        android:text="对话框进度条"
        android:onClick="showDialogProgress"/>
/*
    * 显示对话框进度条
    * @param v
    * */
    public void showDialogProgress(View v){
        //创建对话框进度条
        ProgressDialog pd=new ProgressDialog(this);
        pd.setMax(100);
        pd.setIndeterminate(false);
        //当前进度
        pd.setProgress(30);
        pd.setTitle("下载对话框");
        pd.setMessage("正在下载中...");
        //设置水平样式
        pd.setProgressStyle(ProgressDialog.STYLE_HORIZONTAL);
        pd.show();
		//ProgressDialog pd2=ProgressDialog.show(this,"download","downloading...",false);
    }

setCancelable()是否可以取消,true为可以
默认为圈形进度条
在这里插入图片描述
在这里插入图片描述
标题进度条

public class Main2Activity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        //设置标题栏
        requestWindowFeature(Window.FEATURE_INDETERMINATE_PROGRESS);
        setContentView(R.layout.activity_main2);
        //显示进度条
        setProgressBarIndeterminateVisibility(true);

3.自定义进度条
在这里插入图片描述
在drawable中创建progress_bg,将自己想要的进度条图片放在drawable下

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <rotate android:drawable="@drawable/z1"
            android:fromDegrees="0"
            android:toDegrees="360"
            android:pivotX="50%"
            android:pivotY="50%"></rotate>
    </item>
</layer-list>
<ProgressBar
        android:id="@+id/progressBar5"
        style="?android:attr/progressBarStyle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_below="@id/button1"
        android:indeterminateDrawable="@drawable/progress_bg"/>

AlterDialog提示消息

1.提示对话框

<Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true"
        android:text="提示对话框"
        android:onClick="dialogClick1"/>
/*
    * 1.提示对话框
    * @param v
    * */
    public void dialogClick1(View v){
        //创建一个提示对话框的构造者
        AlertDialog.Builder builder=new AlertDialog.Builder(this);
        builder.setTitle("提示");
        builder.setMessage("请问你爱学习吗?");
        builder.setIcon(R.mipmap.ic_launcher);
        //正面的按钮
        builder.setPositiveButton("爱", new DialogInterface.OnClickListener() {
            @Override
            public void onClick(DialogInterface dialog, int which) {
                Toast.makeText(Main2Activity.this, "对不起,打扰了", Toast.LENGTH_SHORT).show();
            }
        });
        //反面的按钮
        builder.setNegativeButton("不爱", new DialogInterface.OnClickListener() {
            @Override
            public void onClick(DialogInterface dialog, int which) {
                Toast.makeText(Main2Activity.this, "认识一下吧!", Toast.LENGTH_SHORT).show();
            }
        });
        //中立的按钮
        builder.setNeutralButton("隐藏对话框", new DialogInterface.OnClickListener() {
            @Override
            public void onClick(DialogInterface dialog, int which) {
                Toast.makeText(Main2Activity.this, "随便了", Toast.LENGTH_SHORT).show();
            }
        });
//两种显示方法:
		//第一种
//        AlertDialog dialog = builder.create();
//        dialog.show();
		//第二种
        builder.show();
    }

在这里插入图片描述
在这里插入图片描述
2.列表对话框

<Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_below="@id/button1"
        android:layout_alignParentEnd="true"
        android:layout_alignParentRight="true"
        android:onClick="dialogClick2"
        android:text="列表选项对话框" />
 //列表对话框
    public void dialogClick2(View v){
        AlertDialog.Builder builder=new AlertDialog.Builder(this);
        builder.setTitle("请选择一个平台");
        final String[] items={"Android","iOS","Windows Phone"};
        builder.setItems(items, new DialogInterface.OnClickListener() {
            @Override
            public void onClick(DialogInterface dialog, int which) {
                Toast.makeText(Main2Activity.this, items[which], Toast.LENGTH_SHORT).show();
            }
        });
        builder.show();
    }

在这里插入图片描述在这里插入图片描述
3.多选列表对话框

<Button
        android:id="@+id/button3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_below="@id/button2"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true"
        android:text="多选列表对话框"
        android:onClick="dialogClick3"
 //多选列表对话框
    public void dialogClick3(View v){
        AlertDialog.Builder builder=new AlertDialog.Builder(this);
        builder.setTitle("请选择一个平台");
        final ArrayList<String> list=new ArrayList<String>();
        final String[] items={"Android","iOS","Windows Phone"};
        builder.setMultiChoiceItems(items, null, new DialogInterface.OnMultiChoiceClickListener() {
            @Override
            public void onClick(DialogInterface dialog, int which, boolean isChecked) {
                if (isChecked){
                    list.add(items[which]);
                }else{
                    list.remove(items[which]);
                }
            }
        });
        //正面的按钮
        builder.setPositiveButton("OK", new DialogInterface.OnClickListener() {
            @Override
            public void onClick(DialogInterface dialog, int which) {
                Toast.makeText(Main2Activity.this, list.toString(), Toast.LENGTH_SHORT).show();
                dialog.dismiss();
            }
        });
        //反面的按钮
        builder.setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
            @Override
            public void onClick(DialogInterface dialog, int which) {
                list.clear();
                dialog.dismiss();
            }
        });
        builder.show();
    }

在这里插入图片描述在这里插入图片描述
4.单选项对话框

 //多项单选对话框
    String result="";
    public void dialogClick4(View v){
        AlertDialog.Builder builder=new AlertDialog.Builder(this);
        builder.setTitle("请选择一个平台");
        final String[] items={"Android","iOS","Windows Phone"};
        builder.setSingleChoiceItems(items, 0, new DialogInterface.OnClickListener() {
            @Override
            public void onClick(DialogInterface dialog, int which) {
                result=items[which];
                Toast.makeText(Main2Activity.this,"你选中了"+items[which],Toast.LENGTH_SHORT).show();
            }
        });
        //正面的按钮
        builder.setPositiveButton("OK", new DialogInterface.OnClickListener() {
            @Override
            public void onClick(DialogInterface dialog, int which) {
                Toast.makeText(Main2Activity.this, result, Toast.LENGTH_SHORT).show();
                dialog.dismiss();
            }
        });
        //反面的按钮
        builder.setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
            @Override
            public void onClick(DialogInterface dialog, int which) {
                dialog.dismiss();
            }
        });
        builder.show();
    }

在这里插入图片描述在这里插入图片描述
5.自定义对话框
首先新建一个布局文件
内置EditText

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="@dimen/default_gap"//在dimens中获取自定的样式
    android:orientation="vertical">

    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/edidText_username"
        android:inputType="textPersonName"
        android:hint="username"/>
    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/edidText_password"
        android:inputType="textPassword"
        android:hint="password"/>
</LinearLayout>
//自定义对话框
    public void dialogClick5(View v){
        AlertDialog.Builder builder=new AlertDialog.Builder(this);
        builder.setTitle("登录对话框");

//        builder.setView(R.layout.login_layout);//api 21(android 5.0) 支持
        //实例化布局文件
        final View view=getLayoutInflater().inflate(R.layout.login_layout,null);
        builder.setView(view);

        //正面的按钮
        builder.setPositiveButton("OK", new DialogInterface.OnClickListener() {
            @Override
            public void onClick(DialogInterface dialog, int which) {
                EditText editText_password = view.findViewById(R.id.edidText_password);
                EditText editText_username = view.findViewById(R.id.edidText_username);
                String username=editText_username.getText().toString();
                String password=editText_password.getText().toString();
                Toast.makeText(Main2Activity.this, username+"--"+password, Toast.LENGTH_SHORT).show();
                dialog.dismiss();
            }
        });
        //反面的按钮
        builder.setNegativeButton("Cancel", new DialogInterface.OnClickListener() {
            @Override
            public void onClick(DialogInterface dialog, int which) {
                dialog.dismiss();
            }
        });
        builder.show();

    }

在这里插入图片描述在这里插入图片描述

日期和时间

1.TimePickerDialog
新建一个Java类,用于显示时间对话框

public class TimePickerFragment extends DialogFragment implements TimePickerDialog.OnTimeSetListener {
    int hour;
    int minute;
    private Main2Activity main2Activity;

    @Override
    public void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        main2Activity= (Main2Activity) getActivity();
    }

    @NonNull
    @Override
    public Dialog onCreateDialog(@Nullable Bundle savedInstanceState) {
        //获取当前系统时间
        Calendar c=Calendar.getInstance();
        int hour = c.get(Calendar.HOUR_OF_DAY);
        int minute = c.get(Calendar.MINUTE);
//创建时间对话框,参数为(上下文,设置时间事件,小时,分钟,是否为24小时)
        TimePickerDialog dialog=new TimePickerDialog(getActivity(),this,hour,minute,true);

        return dialog;
    }
//时间对话框完成按钮的单击事件
    @Override
    public void onTimeSet(TimePicker view, int hourOfDay, int minute) {
        this.hour= hourOfDay;
        this.minute=minute;
        main2Activity.setTimeValue(hour,minute);
    }
}
<Button
        android:id="@+id/button_setTime"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_below="@id/textView_time"
        android:text="设置时间"
        android:onClick="setTimeClick"/>

    <TextView
        android:id="@+id/textView_time"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:text="no time" />

方法

 private TextView textView_time;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main2);
        textView_time=findViewById(R.id.textView_time);
    }

    public void setTimeValue(int hour,int minute){
        textView_time.setText(hour+":"+minute);
    }

    public void setTimeClick(View view){
        DialogFragment timePickerFragment=new TimePickerFragment();
        timePickerFragment.show(getSupportFragmentManager(),"timePicker");
    }

在这里插入图片描述在这里插入图片描述
2.DatePickerDialog
新建类

public class DatePickerFragment extends DialogFragment implements DatePickerDialog.OnDateSetListener {

    private Main3Activity main3Activity;
    @Override
    public void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        main3Activity= (Main3Activity) getActivity();
    }

    //用于创建日期对话框的事件方法
    @NonNull
    @Override
    public Dialog onCreateDialog(@Nullable Bundle savedInstanceState) {

        Calendar c=Calendar.getInstance();
        int year= c.get(Calendar.YEAR);
        int mouth= c.get(Calendar.MONTH);
        int day=c.get(Calendar.DAY_OF_MONTH);

        DatePickerDialog dialog=new DatePickerDialog(getActivity(),this,year,mouth,day);

        return dialog;
    }

    @Override
    public void onDateSet(DatePicker view, int year, int month, int dayOfMonth) {
        main3Activity.setDateValue(year,month,dayOfMonth);
    }
}

<TextView
        android:id="@+id/textView_date"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:text="no date" />

    <Button
        android:id="@+id/button19"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_below="@id/textView_date"
        android:onClick="setDateClick"
        android:text="设置日期" />
private TextView textView_date;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main3);
        textView_date=findViewById(R.id.textView_date);
    }

    public void setDateValue(int year,int mouth,int day){
        textView_date.setText(year+"年"+(mouth+1)+"月"+day+"日");
    }

    public void setDateClick(View view){
        DialogFragment dateDialogFragment = new DatePickerFragment();
        dateDialogFragment.show(getSupportFragmentManager(),"datePicker");
    }

在这里插入图片描述在这里插入图片描述

3.TimePicker

<TimePicker
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/timePicker"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"/>

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_below="@id/timePicker"
        android:onClick="saveClick"
        android:text="保存" />
 private TimePicker timePicker;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main3);
        timePicker=findViewById(R.id.timePicker);
    }

    public void saveClick(View v){
        int hour = timePicker.getCurrentHour();
        int minute = timePicker.getCurrentMinute();
        Toast.makeText(this,hour+":"+minute,Toast.LENGTH_SHORT).show();
    }

在这里插入图片描述
4.DatePicker

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".Main3Activity">

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <TimePicker
                android:id="@+id/timePicker"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentStart="true"
                android:layout_alignParentLeft="true"
                android:layout_alignParentTop="true"/>

            <Button
                android:id="@+id/button1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentStart="true"
                android:layout_alignParentLeft="true"
                android:layout_below="@id/timePicker"
                android:onClick="saveClick"
                android:text="保存" />

            <DatePicker
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/datePicker"
                android:layout_below="@id/button1"
                android:layout_alignParentStart="true"
                android:layout_alignParentLeft="true"/>

            <Button
                android:id="@+id/button2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentStart="true"
                android:layout_alignParentLeft="true"
                android:layout_below="@id/datePicker"
                android:onClick="okClick"
                android:text="保存" />
        </RelativeLayout>
    </ScrollView>
</LinearLayout>

ScrollView为滚动条控件

private TimePicker timePicker;
    private DatePicker datePicker;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main3);
        timePicker=findViewById(R.id.timePicker);
        datePicker=findViewById(R.id.datePicker);
    }

    public void saveClick(View v){
        int hour = timePicker.getCurrentHour();
        int minute = timePicker.getCurrentMinute();
        Toast.makeText(this,hour+":"+minute,Toast.LENGTH_SHORT).show();
    }

    public void okClick(View v){
        int year = datePicker.getYear();
        int mouth = datePicker.getMonth();
        int day = datePicker.getDayOfMonth();
        Toast.makeText(this,year+"年"+(mouth+1)+"月"+day+"日",Toast.LENGTH_SHORT).show();
    }

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/UUUUUltraman/article/details/88604190