• Android --- 常见UI组件


    TextView 文本视图

    设置字体大小:android:textSize="20sp" 用sp
    设置颜色:android:textColor="#00ffff"
    设置倍距(行距):android:lineSpacingMultiplier="2"
    设置具体行距:android:lineSpacingExtra="15sp" 与倍距只可取其一
    过长文本的处理方式:
        1.在外面添加滚动条,注意,一个滚动条里面只能添加一个子控件
        2.省略过长部分,取消换行部分
    省略过长部分:
        1.android:singleLine="true" 后面加省略号  android:ellipsize="middle" 设置省略号的位置
        2.android:lines="1"  设置单行  后面加句号
    1. <TextView
    2. android:layout_width="match_parent"
    3. android:layout_height="match_parent"
    4. android:textSize="20sp"
    5. android:textColor="#00ffff"
    6. android:lineSpacingMultiplier="2"
    7. android:text="@string/long_text"/>

    eg:跑马灯 

    跑马灯,一个页面只有一个跑马灯生效,因为它需要获取焦点
        android:ellipsize="marquee" 设置跑马灯形式
        android:focusable="true" 设置可以获取焦点
        android:focusableInTouchMode="true" 设置在触摸时获取焦点
        android:marqueeRepeatLimit="marquee_forever" 设置跑马灯时长

    1. <TextView
    2. android:layout_width="match_parent"
    3. android:layout_height="match_parent"
    4. android:textSize="20sp"
    5. android:textColor="#00ffff"
    6. android:singleLine="true"
    7. android:ellipsize="marquee"
    8. android:focusable="true"
    9. android:focusableInTouchMode="true"
    10. android:marqueeRepeatLimit="marquee_forever"
    11. android:text="@string/long_text"/>

    string类中定义的长文本 

    1. <string name="long_text"> 洞穴昏暗潮湿,被植物发出的微弱荧光照亮。
    2.   石壁上缠绕着藤蔓,墨绿,深紫,浓黑,像大团的、纠缠的蛇。
    3.   一只黑色的飞虫跌跌撞撞闯入,它长着六只坚硬的翅膀,有三个口器。
    4.   下一秒,纠缠的藤蔓间忽然出现一个巨大的深紫色膨起,它迅速裂开,像张开了一张嘴,在下一刻瞬间合拢,将飞虫吞入腹中。
    5.   藤蔓群缓缓蠕动起来,膨起的那部分逐渐回收,恢复到原本的状态。
    6.   洞穴里响起仿佛翅膀扇动的声音,一滴粘液拖曳着半透明的细丝从洞穴顶端落下来,啪嗒一声落进地面黏腻的苔藓里,它们细微地蠕动起来,这滴闪光的粘液很快被吸收殆尽,在地面消失了踪影。
    7.   角落——被绿色真菌发出的荧光照亮的角落。岩石与土壤的缝隙里,白色像潮水一样涌出来,覆盖了大片的区域,是雪白的菌丝。它生长,蔓延,伸出数以亿计的触角,最后向着中央蠕动而去,合拢,聚集,拉长,一个形体出现。一只脚踏上厚重软腻的苔藓,苔藓陷下去吞没了它,只露出雪白的脚踝。
    8.   安折看自己的脚踝——属于人类的肢体,由骨架、肌肉和血管支撑起来的肢体,关节可以活动,但因骨骼的限制并不灵活。角质层构成指甲,圆润透明,是退化的产物,来自兽类锋利的爪尖。
    9.   他抬起腿,迈出一步,先前因被踩而凹陷的苔藓湿凉且富有弹性,在他离开后重新聚拢起来,像竖立的蚯蚓。
    10.   这一次,他脚下踩到了别的东西,是一具人类骨骼的手臂。
    11.   昏暗中,安折望向那具骷髅。
    12. </string>

    ImageView

    • android:adjustViewBounds:设置ImageView是否调整自己的边界来保持所显示图片的长宽比。
    • android:maxHeight:设置ImageView的最大高度。
    • android:maxWidth:设置ImageView的最大宽度。
    • android:scaleType:设置所显示的图片如何缩放或移动以适应ImageView的大小。

    •matrix:使用matrix方式进行缩放。
    •fitXY:横向、纵向独立缩放,以适应该ImageView。
    •fitStart:保持纵横比缩放图片,并且将图片放在ImageView的左上角。
    •fitCenter:保持纵横比缩放图片,缩放完成后将图片放在ImageView的中央。
    •fitEnd:保持纵横比缩放图片,缩放完成后将图片放在ImageView的右下角。
    •center:把图片放在ImageView的中央,但是不进行任何缩放。
    •centerCrop:保持纵横比缩放图片,以使图片能完全覆盖ImageView。
    •centerInside:保持纵横比缩放图片,以使得ImageView能完全显示该图片。

    • android:src:设置ImageView所显示的Drawable对象的ID。 

    ImageButton

    ImageButton继承与ImageView;

    Button可以显示图片也可以显示文本,而ImageButton只能显示图片;

    ImageButton中的图片可以按比例缩放;

    Button只能设置一张图片,而ImageButton可以设置前景和背景两张图片重叠的效果

    EditView

    1. <EditText
    2. android:layout_width="match_parent"
    3. android:layout_height="wrap_content"
    4. android:layout_marginLeft="30dp"
    5. android:layout_marginRight="30dp"
    6. android:layout_marginTop="20dp"
    7. android:background="@color/design_default_color_secondary"
    8. android:gravity="center"
    9. android:inputType="number"
    10. android:maxLength="12"
    11. android:hint="账号"/>
    12. <EditText
    13. android:layout_width="match_parent"
    14. android:layout_height="wrap_content"
    15. android:layout_marginLeft="30dp"
    16. android:layout_marginRight="30dp"
    17. android:layout_marginTop="20dp"
    18. android:gravity="center_horizontal"
    19. android:background="@color/design_default_color_secondary"
    20. android:inputType="textPassword"
    21. android:hint="密码"/>

    Button

    CheckBox 多选按钮

    CheckBox继承CompoundButton,是多选按钮。
    android:checked设置按钮是否选中。

    • setOnCheckedChangeListener(OnCheckedChangeListener)来对多选按钮进行监听。
    • boolean isChecked() 判断当前按钮是否选中
    • void.setChecked(boolean checked) 设置按钮是否勾选
    1. CheckBox checkBox = findViewById(R.id.checkBox1);
    2. // 设置选中状态
    3. checkBox.setChecked(false);
    4. // checkBox.isChecked() 获取选中状态
    5. boolean isChecked = checkBox.isChecked();
    6. Log.e("isChecked","当前复选框选中状态:"+isChecked);
    7. // 监听状态变化 setOnCheckedChangeListener() 方法
    8. checkBox.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
    9. @Override
    10. public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
    11. Log.e("isChecked","当前复选框选中状态:"+isChecked);
    12. }
    13. });

    RadioButton 单选按钮

    单选控件和 RadioGroup 一起使用, 在一个 RadioGroup 中只能选中一个

    android:checkedButton指定初始选项。

    RadioGroup 添加监听器:setOnCheckedChangeListener(OnCheckedChangeListener)

    1. <?xml version="1.0" encoding="utf-8"?>
    2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    3. xmlns:app="http://schemas.android.com/apk/res-auto"
    4. xmlns:tools="http://schemas.android.com/tools"
    5. android:layout_width="match_parent"
    6. android:layout_height="match_parent"
    7. tools:context=".RadioButtonActivity">
    8. <RadioGroup
    9. android:layout_width="match_parent"
    10. android:layout_height="400dp"
    11. android:background="@color/cardview_shadow_start_color">
    12. <RadioButton
    13. android:layout_width="wrap_content"
    14. android:layout_height="wrap_content"
    15. android:text="111"/>
    16. <RadioButton
    17. android:layout_width="wrap_content"
    18. android:layout_height="wrap_content"
    19. android:text="222"/>
    20. <RadioButton
    21. android:layout_width="wrap_content"
    22. android:layout_height="wrap_content"
    23. android:text="333"/>
    24. <RadioButton
    25. android:layout_width="wrap_content"
    26. android:layout_height="wrap_content"
    27. android:text="444"/>
    28. </RadioGroup>
    29. </LinearLayout>
    1. radioGroup = findViewById(R.id.radioGroupId);
    2. radioGroup.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
    3. @Override
    4. // checkedId 是选中的 RadioButton 的id
    5. public void onCheckedChanged(RadioGroup group, int checkedId) {
    6. // 找到选中的 RadioButton
    7. RadioButton radioButton = findViewById(checkedId);
    8. Toast.makeText(RadioButtonActivity.this, "当前选中的单选项:"+radioButton.getText(), Toast.LENGTH_SHORT).show();
    9. }
    10. });

     

    ToggleButton 开关触发器

    1. <ToggleButton
    2. android:id="@+id/toggleButton1"
    3. android:layout_width="wrap_content"
    4. android:layout_height="wrap_content"
    5. android:layout_gravity="center"
    6. android:textOff="关闭了"
    7. android:textOn="打开了"
    8. android:checked="true"
    9. android:text="ToggleButton" />

    SeekBar 滑动条

    android:max=“255” (最大的滑动值,从0开始)

    android:progress=“255”(初始时滑动条的位置)

    1. <SeekBar
    2. android:id="@+id/seekBar"
    3. android:max="100"
    4. android:progress="30"
    5. android:layout_width="match_parent"
    6. android:layout_height="wrap_content" />
    1. public class RadioButtonActivity extends AppCompatActivity {
    2. @Override
    3. protected void onCreate(Bundle savedInstanceState) {
    4. super.onCreate(savedInstanceState);
    5. setContentView(R.layout.activity_radio_button);
    6. SeekBar seekBar = findViewById(R.id.seekBar);
    7. // 设置最大值
    8. seekBar.setMax(50);
    9. // 设置当前进度
    10. seekBar.setProgress(40);
    11. seekBar.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
    12. // 进度改变时(过程中)的回调方法
    13. @Override
    14. public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
    15. Log.e("seekBar change","当前seekBar的进度:"+progress);
    16. }
    17. // 开始时回调的方法
    18. @Override
    19. public void onStartTrackingTouch(SeekBar seekBar) {
    20. Log.e("seekBar开始了","当前seekBar的进度:"+seekBar.getProgress());
    21. }
    22. // 结束时回调的方法
    23. @Override
    24. public void onStopTrackingTouch(SeekBar seekBar) {
    25. Log.e("seekBar结束了","当前seekBar的进度:"+seekBar.getProgress());
    26. }
    27. });
    28. }
    29. }

     ProgressBar 进度条

    1. <?xml version="1.0" encoding="utf-8"?>
    2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    3. xmlns:tools="http://schemas.android.com/tools"
    4. android:layout_width="match_parent"
    5. android:layout_height="match_parent"
    6. android:orientation="vertical"
    7. tools:context=".ProgressBarActivyty">
    8. <!--
    9. ProgressBar 的默认形式是转圈圈
    10. style="?android:attr/progressBarStyleHorizontal" style 设置风格
    11. android:max="100" 进度条的最大值
    12. android:indeterminate="true" 永恒滚动
    13. android:progress="10" 已完成进度
    14. -->
    15. <ProgressBar
    16. android:layout_width="wrap_content"
    17. android:layout_height="wrap_content"/>
    18. <ProgressBar
    19. android:layout_width="300dp"
    20. android:layout_height="wrap_content"
    21. android:progress="10"
    22. android:max="100"
    23. style="?android:attr/progressBarStyleHorizontal"/>
    24. <ProgressBar
    25. android:id="@+id/progress"
    26. android:layout_width="300dp"
    27. android:layout_height="wrap_content"
    28. android:progress="10"
    29. android:max="100"
    30. android:indeterminate="true"
    31. style="?android:attr/progressBarStyleHorizontal"/>
    32. <ProgressBar
    33. android:id="@+id/progress1"
    34. android:layout_width="300dp"
    35. android:layout_height="wrap_content"
    36. android:max="100"
    37. style="?android:attr/progressBarStyleHorizontal"/>
    38. </LinearLayout>
    1. public class ProgressBarActivyty extends AppCompatActivity {
    2. @Override
    3. protected void onCreate(Bundle savedInstanceState) {
    4. super.onCreate(savedInstanceState);
    5. setContentView(R.layout.activity_progress_bar);
    6. ProgressBar progressBar1 = findViewById(R.id.progress1);
    7. // 设置progressBar进度
    8. // progressBar1.setProgress(80);
    9. // 通过代码控制进度--- 利用线程
    10. // 但是在Android 4.0 之后不能在线程中直接操纵控件,会崩溃。progressBar是一个特例
    11. new Thread(){
    12. public void run(){
    13. for (int i = 1; i <= 100 ; i++) {
    14. progressBar1.setProgress(i);
    15. try {
    16. // 休眠一下
    17. Thread.sleep(30);
    18. } catch (InterruptedException e) {
    19. throw new RuntimeException(e);
    20. }
    21. }
    22. }
    23. }.start();
    24. }
    25. }

    共有属性

    margin: 外边距,控件的外部边缘距离其父容器边缘的距离
    padding: 内边距,控件内部的控件距离它边缘的边距
    gravity:控件内部的控件相对于它的位置
    layout_gravity:控件本身相对于父容器的位置
    visibility: 可见状态 gone(不可见也不保留位置) visible(可见) invisible(不可见但保留位置)

  • 相关阅读:
    c++ - 第15节 - 二叉树进阶
    C++错题本
    最重要的技术深入学习
    11 抽象向量空间
    RxJava 一篇文章就够了
    下班时间做抖音小店,连直播都不会的我,7天销售额流水50多万
    11:STM32---spl通信
    c++多线程(一)线程管理
    YOLOv8改进有效涨点专栏目录——包含backbone、head、neck和损失函数上百余种改进技巧
    前端笔记_OAuth规则机制下实现个人站点接入qq三方登录
  • 原文地址:https://blog.csdn.net/weixin_43244083/article/details/138126193