参考资源:
实现效果
第一步, 开启数据绑定和视图绑定
参加 Android初学 数据的双向绑定(Dabinding和ViewBinding的简单使用)中的第一步
第二步, 写ViewModel
public class MyViewModel extends ViewModel {
/**
* 进度条的值
*/
private final ObservableField<Integer> mProcess = new ObservableField<>(100);
/**
* 图片的透明度
*/
private final ObservableField<Float> mAlpha = new ObservableField<>(1f);
public ObservableField<Integer> getProcess() {
return mProcess;
}
public ObservableField<Float> getAlpha() {
return mAlpha;
}
}
第三步, 写布局文件, 并根据提示修改布局文件为数据绑定布局
<?xml version="1.0" encoding="utf-8"?>
<layout 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">
<data>
<variable
name="myViewModel"
type="work.wxmx.mvvmtest.MyViewModel" />
</data>
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<ImageView
android:id="@+id/imageView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:alpha="@{myViewModel.alpha}"
app:layout_constraintBottom_toTopOf="@+id/guideline"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.498"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="@android:mipmap/sym_def_app_icon" />
<androidx.constraintlayout.widget.Guideline
android:id="@+id/guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.8" />
<SeekBar
android:id="@+id/seekBar"
android:layout_width="267dp"
android:layout_height="19dp"
android:max="100"
android:progress="@={myViewModel.process}"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="@+id/guideline" />
</androidx.constraintlayout.widget.ConstraintLayout>
</layout>
效果图如下图所示:
第四步, 写Activity
public class MainActivity extends AppCompatActivity {
private ActivityMainBinding mBinding;
private MyViewModel mViewModel;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
mBinding = ActivityMainBinding.inflate(getLayoutInflater());
mViewModel = new ViewModelProvider(this).get(MyViewModel.class);
setContentView(mBinding.getRoot());
mBinding.setMyViewModel(mViewModel);
// 从网络加载图片 并更新UI
new Thread(() -> {
Bitmap bitmap = loadImageFromNetwork("https://wx1.sinaimg.cn/mw2000/006a0Rdhly1gsqqjwj048j31ed2a77wi.jpg");
mBinding.imageView.postDelayed(() -> mBinding.imageView.setImageBitmap(bitmap), 2000);
}).start();
// 监听拖动条值的变化 改变透明度的值
mViewModel.getProcess().addOnPropertyChangedCallback(new Observable.OnPropertyChangedCallback() {
@Override
public void onPropertyChanged(Observable sender, int propertyId) {
mViewModel.getAlpha().set(mViewModel.getProcess().get() / 100.0f);
}
});
}
private Bitmap loadImageFromNetwork(String s) {
try {
URL url = new URL(s);
URLConnection urlConnection = url.openConnection();
urlConnection.connect();
InputStream inputStream = urlConnection.getInputStream();
return BitmapFactory.decodeStream(inputStream);
} catch (IOException e) {
e.printStackTrace();
}
return null;
}
}