阶段小练—篮球比赛计分器

阶段性回顾

回顾内容：
VieModel Screen Orientation
LiveData Localization
DataBinding Vector Drawable

UI界面

由上而下解析：

第一行两个textView 控件用于显示队伍 A和队伍B
第二行两个textView控件用于显示两队的比分
中间三行Button控件用于点击增加分数
最后一行为两个矢量图标/图片按钮，左边用于后退一步加分操作，右边将分数初始化为 0：0

界面字体背景优化

为方便调节字体的大小，可以创建需要的资源

分别创建了三种字体大小不同的资源，分别供应于 队伍名、比分、按钮的字体大小使用

为区别队伍的划分，改变 两队伍比分的字体颜色和背景

字体颜色改变：textColor
背景改变 ：background

调用矢量图形的方法

res -> new -> Vector Asset

注意：使用矢量图形需要在 Gradle 中声明一句话，用于上下兼容，因为在低于5.0以下不支持矢量图

解决方法：在Gradle 中加入上图中的话

android.defaultConfig.vectorDrawables.useSupportLibrary = true

同时，由于一会儿需要用到DataBinding,所以添加

dataBinding{
enabled true
}

最后Sync一下，不出现红色则没有问题

注意点： 调用 imageView或imageButton时，我们需要增加参数：contentDescription
这个参数的意义在于照顾一些生理功能有缺陷的人，如果图片复杂，用户色盲色弱，则这个参数可以供系统读出来，加强用户体验。例如中间几行的按钮读的话，就可以是 加1 加2、、、、

代码部分

MyViewModel

创建一个New Class : MyViewModel
继承于 ViewModel

package com.example.score;

import androidx.lifecycle.MutableLiveData;
import androidx.lifecycle.ViewModel;

public class MyViewModel extends ViewModel {   //继承于ViewModel
    private MutableLiveData<Integer> aTeamScore;  //定义变量 记录队伍的分数
    private  MutableLiveData<Integer> bTeamScore;
    private int aBack,bBack;  //存放前一次的分数
//队伍A
    public MutableLiveData<Integer> getaTeamScore() {
        if(aTeamScore == null)  //如果为空，则创建一个，并初始化为0
        {
            aTeamScore = new MutableLiveData<>();
            aTeamScore.setValue(0);
        }
        return aTeamScore;
    }
//队伍B
    public MutableLiveData<Integer> getbTeamScore() {
        if(bTeamScore == null)
        {
            bTeamScore = new MutableLiveData<>();
            bTeamScore.setValue(0);
        }
        return bTeamScore;
    }
//A队伍加分
    public void aTeamAdd(int p) {
        aBack = aTeamScore.getValue();
        bBack = bTeamScore.getValue();
        aTeamScore.setValue(aTeamScore.getValue() +p);
    }
//B队伍加分
    public void bTeamAdd(int p){
        aBack = bTeamScore.getValue();
        bBack = bTeamScore.getValue();
        bTeamScore.setValue(bTeamScore.getValue()+p);
    }
//reset初始化方法
    public void reset() {
        aBack = aTeamScore.getValue();
        bBack = bTeamScore.getValue();
        aTeamScore.setValue(0);
        bTeamScore.setValue(0);
    }
//undo返回上一步方法
    public void undo(){
        aTeamScore.setValue(aBack);
        bTeamScore.setValue(bBack);
    }
}

MainActivity

将 MyViewModel 绑定进去
因为我们使用 dataBinding 所以进行如下修改

添加变量,name = “data”,类为”MyViewModel“

package com.example.score;

import···;    //多种包的引入，新建项目时自动给出，因此不做解释

public class MainActivity extends AppCompatActivity {
    MyViewModel myViewModel;     //绑定MyViewModel
    ActivityMainBinding binding;   //绑定这个类，需要使用dataBinding,在xml文件中进行修改，如上面所描述

  @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        binding = DataBindingUtil.setContentView(this,R.layout.activity_main);
        myViewModel = new ViewModelProvider(this).get(MyViewModel.class);
        binding.setData(myViewModel);
        binding.setLifecycleOwner(this);
    }
}

再次强调
Providers 已经启用，需要采用新的方法

使用方法：首先，在build.grade中添加依赖（版本可不一样）

implementation’androidx.lifecycle:lifecycle-extensions:2.2.0’

Sync以下，不出现红色则没有问题
之后，先：导入包 ->

import androidx.lifecycle.ViewModelProvider;

再：

myViewModel = new ViewModelProvider(this).get(MyViewModel.class);

数据绑定

Button按钮的数据绑定

如图，点击一个button控件，右键 -> Go to XML
添加方法进行数据绑定

android:onClick="@{()->data.aTeamAdd(1)}"

分别对与队伍A与队伍B加分的数据进行绑定
如上图所示表示对于队伍A 的加一分的数据进行绑定
同理，其他加分项进行相对应的处理

TextView的数据绑定

右键 -> Go to XML
进行如下修改：（函数调用方法）

android:text="@{String.valueOf(data.getaTeamScore())}"

同理，B队伍 Score TextView数据绑定做相应的处理

Screen Orientation(屏幕旋转)

按钮高度以及字体大小优化

设置横屏状态下的布局

点击 -> Creat Landscape Variation

看图我们容易得到，由于我们设置的字体或边框太大，导致横屏状态下，按钮控件之间非常紧密
我们再设置一些资源供横盘状态下使用

按钮高度

将竖屏状态按钮高度改为60sp

同时设置横屏时的高度

并将横屏下的按钮高度参数设为此资源

字体大小

同理，依次配置

Localization（本地化）

进行语言支持，点击 Default -> Edit Translations -> 点击地球图标 ->添加Chinese

根据需要进行相应的汉化，如图：

注意：汉化效果的展示需要将手机换为中文环境

调试运行

竖屏状态：

横屏状态

本地化模式

本文地址：https://blog.csdn.net/qq_45984789/article/details/108134139