如何在Android中使用视图绑定

视图绑定允许开发者在一个应用程序中加入重要的交互。这个概念旨在消除findViewById关键字。去除这样的模板代码可以让开发者更有生产力。

当使用视图绑定时，通常会为每个布局文件生成一个绑定类。绑定类存储所有对特定视图的引用。

生成的绑定类与layout.xml 文件的名称几乎相似。例如，detail_main.xml 的绑定类名称是DetailMainBinding 。这种命名技术有助于避免混淆和错误。

视图绑定是无效安全的，而且速度很快。它允许开发者在编程过程中避免常见的错误。

目标

本教程将帮助你理解Android中使用Kotlin的视图绑定概念。

前提条件

要继续学习，你应该具备以下条件

• 对Kotlin编程语言有基本了解。
• 在你的电脑上安装了[Android Studio]。

视图绑定的优势

视图绑定有几个优点。首先，它支持空安全。这个功能可以防止开发者调用不存在的视图或ID。因此，它可以防止应用程序的突然崩溃。

其次，视图绑定有助于减少模板代码。在过去，开发人员不得不大量使用findViewById 关键字。因此，在这些操作上浪费了大量的时间。视图绑定试图消除这种挑战。

视图绑定也促进了类型安全。生成的绑定类与布局文件中声明的视图相匹配。再一次，这个功能可以防止应用程序崩溃。

第1步 - 创建项目

启动Android Studio并创建一个新的空项目。注意，这个过程可能需要一些时间，这取决于你的计算机的属性。

第2步 - 添加所需的依赖性

项目生成后，导航到应用级build.gradle 文件并添加以下代码。

buildFeatures{
        viewBinding true
    }

然后点击sync now 按钮来更新项目。

第3步 - 准备用户界面

让我们在activity_main.xml 文件中声明几个按钮和TextViews ，如下图所示。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/welcome"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!"
        android:layout_margin="20dp"
        android:layout_gravity="center"/>

    <TextView
        android:id="@+id/login"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Login"
        android:layout_margin="20dp"
        android:layout_gravity="center"/>

    <Button
        android:id="@+id/send_data"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Send data"
        android:layout_margin="20dp"
        android:backgroundTint="@color/colorAccent"
        android:layout_gravity="center"/>/>

</LinearLayout>

第4步 - 访问用户界面组件

在这一步，我们需要访问我们在activity_main.xml 文件中定义的UI组件。我们将在MainActivity 中定义并初始化绑定类。

打开MainActivity 文件并纳入以下修改。

class MainActivity : AppCompatActivity() {
    private lateinit var binding: ActivityMainBinding  //defining the binding class

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        binding = ActivityMainBinding.inflate(layoutInflater) //initializing the binding class
        setContentView(binding.root) // we now set the contentview as the binding.root

        binding.welcome.text = "Hallo and welcome"
    }
}

在上面的代码中，我们可以用binding.welcome ，而不是findViewById 来引用TextView 。.text 方面允许我们改变TextView的内容。

为了访问我们之前定义的send_data 按钮，我们使用下面的代码。

binding.send_Data.setOnClickListener{
    //perform an operation
    //send_Data is the button's id
}

第5步 - 在片段中使用视图绑定

片段是许多应用程序的常见组件。由于其生命周期回调和行为，开发者更喜欢片段。片段也可以很容易地从活动中添加和删除。

在片段中加入视图绑定可以带来更好的用户体验。

为了简单起见，让我们创建一个新的Android项目。这一次我们将选择Fragment + ViewModel 作为默认模板。

像往常一样，我们需要在应用级build.gradle 文件中允许视图绑定。

     buildFeatures{
        viewBinding true
    }

让我们在片段中添加以下UI组件。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:id="@+id/main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".ui.main.MainFragment">

    <!-- The fragments have the following TextViews -->

    <TextView
        android:id="@+id/message"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="MainFragment"/>

    <TextView
        android:id="@+id/content"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hallo there. This is a fragment"/>

</LinearLayout>

始终确保所需的UI元素有一个ID。

当我们导航到MainFragment.kt 文件时，你会看到下面的代码。

class MainFragment : Fragment() {

    companion object {
        fun newInstance() = MainFragment()
    }

    private lateinit var viewModel: MainViewModel

    override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?,
                              savedInstanceState: Bundle?): View {
        return inflater.inflate(R.layout.main_fragment, container, false)
    }

    override fun onActivityCreated(savedInstanceState: Bundle?) {
        super.onActivityCreated(savedInstanceState)
        viewModel = ViewModelProviders.of(this).get(MainViewModel::class.java)
        // TODO: Use the ViewModel
    }

}

我们需要对上面的代码做几个修改。首先，我们必须定义并初始化绑定类。我们还应该用生成的绑定类替换return inflater.inflate(R.layout.main_fragment, container, false) 。

首先，让我们创建一个新的绑定变量并将其设置为null，如下图所示。

private var fragbinding = MainFragmentBinding? = null

其次，我们需要用下面的代码片断来替换return inflater.inflate(R.layout.main_fragment, container, false) 。

fragbinding = MainFragmentBinding.inflate(inflater, container, false)
return fragbinding.root

然后我们将从绑定中返回根类，如上所示。

下面是MainFragment 的完整代码。

class MainFragment : Fragment() {

    companion object {
        fun newInstance() = MainFragment()
    }

    private lateinit var viewModel: MainViewModel
    private var fragbinding = MainFragmentBinding? = null

    override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?,
                              savedInstanceState: Bundle?): View {
        fragbinding = MainFragmentBinding.inflate(inflater, container, false)
        return fragbinding.root
    }

    override fun onActivityCreated(savedInstanceState: Bundle?) {
        super.onActivityCreated(savedInstanceState)
        viewModel = ViewModelProviders.of(this).get(MainViewModel::class.java)
        // TODO: Use the ViewModel

        //we can access our UI components, as shown below
        fragbinding.message.text = "Hello there"
        fragbinding.content.text = "This is an example of view binding in Android"
    }

}

结语

在本教程中，我们已经学会了如何在活动和片段中使用视图绑定。视图绑定功能的巨大优势在于它节省了大量的时间，同时也消除了模板代码。

你可以利用从本课程中获得的知识来制作漂亮而高质量的应用程序。