MVVMの設計パターンは、主に、ビューがミドルウェアviewModelを介してモデルデータモデルと相互作用することです。フローチャートを見てみましょう。
この記事では、Google独自のDataBindingコンポーネントを使用してMVVMを実装し、app.gradleで開きます。
dataBinding {
enabled = true
}
レイアウトファイルxmlの表示:
<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools">
<data>
<import type="com.freddy.chat.MainViewModel"/>
<variable
name="viewModel"
type="MainViewModel" />
</data>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity">
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:onClick="@{viewModel.getData}"
android:text="测试" />
<TextView
android:id="@+id/tv_test"
android:layout_width="200dp"
android:layout_height="50dp"
android:layout_marginLeft="20dp"
android:text="@{viewModel.model.name}" />
</LinearLayout>
</layout>
インターフェースの表示:
package com.freddy.chat;
/**
* Created by xie on 2020/10/15.
*/
public interface MainView {
void moveText(int offset);
}
レイヤーアクティビティの表示:
public class MainActivity extends AppCompatActivity implements MainView {
private ActivityMainBinding binding;
@Override
protected void onCreate(Bundle savedInstanceState) {
binding = DataBindingUtil.setContentView(this, R.layout.activity_main);
binding.setViewModel(new MainViewModel(this));
}
@Override
public void moveText(int offset) {
binding.tvTest.setTranslationX(offset);
}
}
ビジネスレイヤーviewModelミドルウェア:
package com.freddy.chat;
import android.view.View;
/**
* Created by xie on 2020/10/14.
*/
public class MainViewModel {
private String name = "测试";
private MainModel model;
private MainView view;
// @BindingAdapter("android:text")
// public static void onTextChange(TextView view, CharSequence text) {
// Log.e("tag", String.valueOf(text));
// }
public MainViewModel(MainView view) {
this.view = view;
this.model = new MainModel();
model.setName(name);
}
public MainModel getModel() {
return model;
}
public void getData(View v) {
model.setName("MVVM测试");
view.moveText(100);
}
}
モデルデータモデル:
package com.freddy.chat;
package com.freddy.chat;
import android.databinding.BaseObservable;
import android.databinding.Bindable;
import com.android.databinding.library.baseAdapters.BR;
/**
* Created by xie on 2020/10/14.
*/
public class MainModel extends BaseObservable {
private String name;
@Bindable
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
notifyPropertyChanged(BR.name);//刷新指定属性UI,刷新所有属性采用notifyChange();
}
}
古いバージョンのButterKnifeと互換性があります。
protected abstract boolean isMvvM();
if (!isMvvM()) {
ButterKnife.bind(this);
}
protected View getContentView() {
View root = LayoutInflater.from(this).inflate(R.layout.activity_base, null);
FrameLayout content = (FrameLayout) root.findViewById(R.id.content_frame);
View contentView = LayoutInflater.from(this).inflate(getContentResource(), null);
content.addView(contentView);
if (isMvvM()) binding = DataBindingUtil.bind(contentView);
return root;
}
public <T extends ViewDataBinding> T getBinding() {
return (T) binding;
}
MVVMの利点:
- UIレイヤー、ビジネスレイヤー、およびデータレイヤーは明確に分離されており、メンテナンスレイヤーが直接識別されるため、コード検索時間とメンテナンスの問題が大幅に軽減されます。
- DataBindingは、モデルが変更されたときに双方向バインディングテクノロジーを使用し、ビューはviewModelを介してUIの自動更新を実現します。
- コントローラ制御層は、ビュー層を直接取得して、制御層コードを削減します。
MVVMのデメリット:
- ビューはデータにバインドされているため、レイアウトを再利用することはできません。
あなたのいいねやコメントが記事を更新する私の動機です。私の記事の出力が一生懸命働いているあなたに役立つことを願っています。一緒に来てください!