MVVM模式使用

MVVM模式使用

MVVM模式的优点

1. 提供了数据和界面绑定的桥梁

MVVM模式的使用

1. gradle在android节点下加入

   dataBinding {
     enabled true
   }

2. 布局根节点加入layout

3. 在activty中不再是setContentView 而是

   ​ DataBindingUtil.setContentView(this, R.layout.activity_main);

   会生成一个和布局文件名相同的ActivityMainBinding，此Binding携带有所有布局的id，和布局中的引用

4. 对于一般情况而言逻辑代码都会写在Model里面,因为Binding携带有布局中所有的数据，方便的进行代码的分离

   <layout xmlns:tools="http://schemas.android.com/tools"
      xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:app="http://schemas.android.com/apk/res-auto"
   >
      <data>
          <import type="android.view.View" />
          <variable
              name="user2"
              type="com.wang.mvvmuse.User2"
              />
          <variable
              name="imageUrl"
              type="String"
              />
          <variable
              name="viewModel"
              type="com.wang.mvvmuse.ViewModel"
              />
      </data>
      <LinearLayout
          android:orientation="vertical"
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          >
   
          <TextView
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:text='@{user2.firstName}'
              app:layout_constraintBottom_toBottomOf="parent"
              app:layout_constraintLeft_toLeftOf="parent"
              app:layout_constraintRight_toRightOf="parent"
              app:layout_constraintTop_toTopOf="parent" />
   
          <ImageView
              app:image = "@{imageUrl}"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:onClick="@{viewModel.onClick}"
           />
   
      </LinearLayout>
   </layout>

   这里需要一个User2的bean类

   firstName 发生变化的时候 代码中的TextView也会发生相应的改变 ，这个就是MVVM的向下通知ObservableFilde

   public class User2 {
      public final ObservableField<String> firstName = new ObservableField<>();
   }

   final User2 user2 = new User2();
   binding.setUser2(user2);
   user2.firstName.set("text");
   new Handler().postDelayed(new Runnable() {
      @Override
      public void run() {
            user2.firstName.set("123456");          
         }
      }, 3000);

5. 图片的加载，需要设置adapter

   public class ImageUtils {
      @BindingAdapter({"image"})
      public static void imageLoader(ImageView view,String url){
          Picasso.with(App.context).load(url)
                  .error(R.mipmap.ic_launcher)
                  .into(view);
      }
   }

6. 设置点击事件

   上图xml中的android:onClick=”@{viewModel.onClick}”会调用这里的点击事件

   public class ViewModel {
      public void onClick(View view){
          Toast.makeText(view.getContext(),"点击事件", Toast.LENGTH_LONG).show();
      }
   }

7. 注意事项

   xml 中不能有中文，否则编译通不过