Android学习——UI基础组件一

Android基础组件

1.Toast组件的使用

  1. Toast显示文本内容`
    在这里插入图片描述
<Button
        android:id="@+id/button20"
        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_alignParentTop="true"
        android:text="Toast显示文本"
        android:clickable="true"
        android:onClick="viewText"/>

在这里插入图片描述

public void viewText(View v){
        //getApplicationContext() 应用程序上下文,作用域为整个程序  全局变量
        //this:当前对象(当前界面的上下文)
        //参数(上下文,要显示的文本内容,显示的时间(Toast.LENGTH_LONG、Toast.LENGTH_SHORT))
        Toast.makeText(getApplicationContext(),"今天天气真好!晴空万里",Toast.LENGTH_LONG).show();
    }

在这里插入图片描述
2. Toast显示图片和图文

<Button
        android:id="@+id/button21"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_alignEnd="@id/button20"
        android:layout_alignRight="@id/button20"
        android:layout_below="@id/button20"
        android:text="Toast显示图片"
        android:onClick="viewImage"/>
/*
    * Toast显示文本
    * @prama v
    * */
    public void viewImage(View v){
        Toast t=new Toast(this);
        //用于显示图片的组件
        ImageView imageView=new ImageView(this);
        //为图片组件设置图片(不能以数字命名)
        imageView.setImageResource(R.drawable.cat);
        t.setView(imageView);
        t.setDuration(Toast.LENGTH_LONG);
        //设置显示的位置
        t.setGravity(Gravity.TOP,0,0);
        t.show();
    }

在这里插入图片描述

<Button
        android:id="@+id/button22"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_alignEnd="@id/button21"
        android:layout_alignRight="@id/button21"
        android:layout_below="@id/button21"
        android:text="Toast显示图文"
        android:onClick="viewImageText"/>
/*
     * 显示图文
     * @param v
     * */
public void viewImageText(View v){
        Toast t=new Toast(this);
        TextView textView=new TextView(this);
        textView.setText("这是eclipse!");
        ImageView imageView=new ImageView(this);
        imageView.setImageResource(R.drawable.cat);

        LinearLayout layout=new LinearLayout(this);
        layout.setOrientation(LinearLayout.VERTICAL);
        layout.addView(imageView);
        layout.addView(textView);

        t.setView(layout);
        t.setGravity(Gravity.CENTER,0,0);
        t.setDuration(Toast.LENGTH_LONG);
        t.show();
    }

在这里插入图片描述

TextView和EditView

TextView

<TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="Hello World!"
        android:textSize="40sp"
        android:textStyle="bold"
        android:background="#00ff00"
        android:textColor="#ff0000"
        android:gravity="center"
        android:id="@+id/textView_email"
        android:textIsSelectable="true"/>
private TextView textView_email;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //绑定布局文件
        setContentView(R.layout.activity_main);
        //根据id查找组件
        textView_email=findViewById(R.id.textView_email);

        textView_email.setText("[email protected]");
    }

在这里插入图片描述
EditText组件

<EditText
        android:id="@+id/editText_name"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"

        android:layout_marginBottom="600dp"
        android:hint="请输入姓名..."
        android:background="#0000ff"
        android:textSize="40sp"
        android:visibility="visible"
        android:editable="true"
        android:drawableLeft="@mipmap/ic_launcher"
        android:inputType="text"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent" />
 private EditText editText_name;
 @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //绑定布局文件
        setContentView(R.layout.activity_main);
        //根据id查找组件
        textView_email=findViewById(R.id.textView_email);

        textView_email.setText("[email protected]");

        editText_name=(EditText) findViewById(R.id.editText_name);
        //监听输入变化
        editText_name.addTextChangedListener(new TextWatcher() {
            @Override
            public void beforeTextChanged(CharSequence s, int start, int count, int after) {
                System.out.println("beforeTextChanged"+s);
            }

            @Override
            public void onTextChanged(CharSequence s, int start, int before, int count) {
                System.out.println("onTextChanged"+s);
            }

            @Override
            public void afterTextChanged(Editable s) {
                System.out.println("afterTextChanged"+s);
            }
        });
        //回车确认键事件
//        editText_name.setOnEditorActionListener(new TextView.OnEditorActionListener() {
//            @Override
//            public boolean onEditorAction(TextView v, int actionId, KeyEvent event) {
//                Toast.makeText(MainActivity.this.v.getText().toString().Toast.LENGTH_LONG).show();
//                return true;
//            }
//        });
    }

在这里插入图片描述

Button的样式和onclick事件设置

Button点击事件设置的方法

 <Button
        android:id="@+id/button20"
        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_alignParentTop="true"
        android:text="按钮的常用属性"
        android:drawableLeft="@mipmap/ic_launcher"
        android:textColor="@color/design_default_color_primary_dark"
        android:textSize="35sp"
        android:clickable="true"
        android:onClick="click1"/>

    <Button
        android:id="@+id/button21"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_alignEnd="@id/button20"
        android:layout_alignRight="@id/button20"
        android:layout_below="@id/button20"
        android:text="使用OnClick属性设置"
        android:textSize="20sp"
        android:onClick="viewImage"/>

    <Button
        android:id="@+id/button22"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_alignEnd="@id/button21"
        android:layout_alignRight="@id/button21"
        android:layout_below="@id/button21"
        android:text="使用view.OnClickListener"
        android:onClick="viewImageText"/>

    <Button
        android:id="@+id/button23"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_alignEnd="@id/button22"
        android:layout_alignRight="@id/button22"
        android:layout_below="@id/button22"
        android:text="Toast显示"
        android:onClick="viewImageText"/>

    <Button
        android:id="@+id/button24"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_alignEnd="@id/button23"
        android:layout_alignRight="@id/button23"
        android:layout_below="@id/button23"
        android:text="使用内部类的方式来注册事件"
        android:onClick="viewImageText"/>

实现按钮单击事件的不同方法

/*
* 1.实现View.OnClickListener下的接口
* 2.设置事件
* */
public class MainActivity extends AppCompatActivity implements View.OnClickListener {

    private Button b1,b2,b3;
    private Button b4;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //绑定布局文件
        setContentView(R.layout.activity_main);
		b1=(Button) findViewById(R.id.button20);
        b2=(Button) findViewById(R.id.button22);
        b3=(Button) findViewById(R.id.button23);
        b4=(Button) findViewById(R.id.button24);
        //注册事件
        b1.setOnClickListener(this);
        b2.setOnClickListener(this);
        b3.setOnClickListener(this);

        //使用内部类的方式来注册事件
        b4.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
              Toast.makeText(MainActivity.this,"使用内部类的方式来注册事件",Toast.LENGTH_SHORT).show();
            }
        });
    }

public void click1(View v){
        Toast.makeText(this,"onClick----",Toast.LENGTH_LONG).show();
    }

@Override
    public void onClick(View v) {
        switch (v.getId()){
            case R.id.button20:
                Toast.makeText(this,"button--20",Toast.LENGTH_LONG).show();
                break;
            case R.id.button22:
                Toast.makeText(this,"button--22",Toast.LENGTH_LONG).show();
                break;
            case R.id.button23:
                Toast.makeText(this,"button--23",Toast.LENGTH_LONG).show();
                break;
        }
    }

在这里插入图片描述

按钮透明化属性

style="?android:attr/borderlessButtonStyle"

在这里插入图片描述
设置背景颜色

android:background="@color/design_default_color_primary_dark"

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
selector选择器
新建一个activitie
在这里插入图片描述
在drawable下新建drawable resource file
点击ok
在这里插入图片描述

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true" android:drawable="@color/colorAccent"/>
    <item android:drawable="@color/design_default_color_primary_dark"/>
</selector>

在这里插入代码片

运行时注意更改运行文件地址
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述
在这里插入图片描述
ImageButton图片按钮

<ImageButton
        android:id="@+id/imageButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentBottom="true"
        android:layout_marginStart="0dp"
        android:layout_marginLeft="0dp"
        android:layout_marginBottom="504dp"
        android:src="@mipmap/ic_launcher"/>

在这里插入图片描述

ImageView

显示任意的图像,如一个图标。可以加载图像从不同来源,负责计算图像的测量,这样它就可以用于任何布局管理器,并提供各种显示选项,如缩放和着色…
android:maxWidth;android:maxHeight;设置最大宽高
android:adjustViewBounds;保持宽高比

<ImageView
        android:id="@+id/imageView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:maxWidth="200dp"
        android:maxHeight="200dp"
        android:adjustViewBounds="true"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        tools:srcCompat="@tools:sample/avatars" />
private ImageView imageView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main2);

        imageView = (ImageView) findViewById(R.id.imageView);

    }

scaletype设置图片属性
android:scaleType=""
参考:https://blog.csdn.net/ren18678213431/article/details/62236932

CheckBox和RadioButton

多选框组件

<CheckBox
        android:id="@+id/checkBox_xs"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:text="小说" />

    <CheckBox
        android:id="@+id/checkBox_g"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/checkBox_xs"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:text="游戏" />

    <CheckBox
        android:id="@+id/checkBox_m"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/checkBox_g"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:text="电影" />

设置单击事件

public class Main2Activity extends AppCompatActivity implements CompoundButton.OnCheckedChangeListener {

    private CheckBox cb_xs,cb_game,cb_movie;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main2);

        cb_xs=(CheckBox) findViewById(R.id.checkBox_xs);
        cb_game=(CheckBox) findViewById(R.id.checkBox_g);
        cb_movie=(CheckBox) findViewById(R.id.checkBox_m);

        //注册事件
        cb_xs.setOnCheckedChangeListener(this);
        cb_game.setOnCheckedChangeListener(this);
        cb_movie.setOnCheckedChangeListener(this);
    }

    @Override
    public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
        switch (buttonView.getId()){
            case R.id.checkBox_xs:
                if (isChecked){
                    Toast.makeText(this,"你选中了小说选项",Toast.LENGTH_SHORT).show();
                }else {
                    Toast.makeText(this,"你取消了小说选项",Toast.LENGTH_SHORT).show();
                }
                break;
            case R.id.checkBox_g:
                if (isChecked){
                    Toast.makeText(this,"你选中了游戏选项",Toast.LENGTH_SHORT).show();
                }else {
                    Toast.makeText(this,"你取消了游戏选项",Toast.LENGTH_SHORT).show();
                }
                break;
            case R.id.checkBox_m:
                if (isChecked){
                    Toast.makeText(this,"你选中了电影选项",Toast.LENGTH_SHORT).show();
                }else {
                    Toast.makeText(this,"你取消了电影选项",Toast.LENGTH_SHORT).show();
                }
                break;
        }
    }
}

在这里插入图片描述
RadioButton组件
先加入一个RadioGroup,再在其中设置RadioButton

<RadioGroup
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/checkBox_m"
        android:orientation="horizontal">
        <RadioButton
            android:id="@+id/radioButton_men"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:checked="true"
            android:text="男" />

        <RadioButton
            android:id="@+id/radioButton_women"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="女" />
    </RadioGroup>

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

ToggleButton和RatingBar

ToggleButton和Switch

<ToggleButton
        android:id="@+id/toggleButton"
        android:layout_width="match_parent"
        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="开关按钮"
        android:textOn="开"
        android:textOff="关"
        android:checked="true"/>

    <Switch
        android:id="@+id/switch1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_below="@id/toggleButton"
        android:text="Switch"
        android:textOff="取消"
        android:textOn="确定"/>

设置开关单击事件

 	private ToggleButton toggleButton;
    private Switch switch1;
   @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main2);

        toggleButton = findViewById(R.id.toggleButton);
        switch1=findViewById(R.id.switch1);
        switch1.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
                Toast.makeText(Main2Activity.this,"ischecked="+isChecked,Toast.LENGTH_SHORT).show();
            }
        });
    }

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
RatingBar有大小两种样式,其中大的只适合标示,不适合交互。
numStars设置星数;stepSize改变的范围;rating初始选中的数量;isIndicator用于指示,不得改变

<RatingBar
        android:id="@+id/ratingBar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentLeft="true"
        android:layout_below="@id/switch1"
        android:numStars="6"
        android:stepSize="0.5"
        android:rating="3"
        android:isIndicator="true"/>

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

猜你喜欢

转载自blog.csdn.net/UUUUUltraman/article/details/88422034
今日推荐