使用Kotlin和XML的Android Button

时间:2020-02-23 14:28:48  来源:igfitidea点击:

在本教程中,我们将学习如何使用Kotlin编程在Android应用中创建按钮。

Android按钮概述

Android Button类扩展了TextView。
Button是一个UI小部件,用于从用户那里获取点击交互以触发应用程序中的操作。

可以在XML布局以及Android Studio项目中的Kotlin Activity类中创建一个按钮。

在XML布局中创建按钮

<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Androidly Button"
  • android:id用于在Button上设置唯一标识符。

  • android:text用于设置按钮内的文本。
    默认情况下,文本以大写字母显示。

  • android:onClick用于定义单击按钮时要在活动中调用的Kotlin函数。
    它是一个点击监听器。

  • android:background用于在按钮上设置背景颜色/可绘制背景。

提示:为防止显示所有大写字母,请使用属性`android:textAllCaps =" false""

有关如何在XML布局中自定义按钮的更多详细信息,请参阅Android Buttons Tutorial。

按钮单击侦听器

我们也可以通过编程方式设置按钮监听器。
以下是两个主要的侦听器:

  • setOnClickListener` –点击按钮时触发。

  • setOnLongClickListner-较长时间按下按钮时触发。

以下代码段在按钮上设置了setOnClickListener。

button.setOnClickListener(object : View.OnClickListener {
          override fun onClick(v: View?) {
              //your implementation goes here
          }
      })

可以将上述代码转换为lambda表达式以使其简短。

button.setOnClickListener {   
    textView.text = "Androidly Buttons"
  }

同样,可以按以下方式定义setOnLongClickListener。

button.setOnLongClickListener {
      textView.text = "Androidly Button Long click"
      true
  }

//or
button.setOnLongClickListener {
      textView.text = "Androidly Button Long click"
      false
  }

在上面的代码中,每个表达式中的最后一条语句是return语句。

  • 如果setOnLongClickListener返回true,则意味着不会触发setOnClickListener。

  • 如果setOnLongClickListener返回false,则意味着将触发setOnClickListener。

这被称为消费事件。
第一种情况消耗事件。

使用Kotlin的Android Button

我们将开发一个应用程序,该应用程序在Button单击时增加TextView的计数器。
我们将使用Kotlin创建按钮。
我们还将了解不同的Button单击处理程序。

1.项目结构

创建一个新的Android Studio项目。
确保在初始设置中启用了Kotlin支持。
完成后,您将看到下面的项目结构。

2. Kotlin按钮代码

activity_main.layout文件类似于以下代码。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  android:id="@+id/linearLayout"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:gravity="center"
  android:orientation="vertical">

  <TextView
      android:id="@+id/txtCounter"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="@string/number_zero"
      android:textAppearance="@style/TextAppearance.AppCompat.Display2"
      android:textColor="#000" 

  <Button
      android:id="@+id/btnIncrementByOne"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:onClick="addOne"
      android:text="@string/increment_by_one" 

</LinearLayout>

我们使用LinearLayout线性(水平或者垂直)放置视图。

建议您在strings.xml文件中设置字符串,而不是对其进行硬编码。
为了获取字符串资源,我们使用@ string/name_of_string

函数addOne(view:View)在MainActivity.kt Kotlin类中定义。

MainActivity.kt类的代码如下。

package net.androidly.androidlybuttons

import android.support.v7.app.AppCompatActivity
import android.os.Bundle
import android.support.v4.content.ContextCompat
import android.view.View
import android.view.ViewGroup
import android.widget.Button
import android.widget.LinearLayout
import kotlinx.android.synthetic.main.activity_main.*

class MainActivity : AppCompatActivity(), View.OnClickListener {
  
  override fun onCreate(savedInstanceState: Bundle?) {
      super.onCreate(savedInstanceState)
      setContentView(R.layout.activity_main)

      var androidlyButton = Button(this)
      androidlyButton.apply {
          layoutParams = LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT)
          text = "Double the value"
          setAllCaps(false)
          textSize = 20f
          id = R.id.btnDouble
      }

      androidlyButton.setOnClickListener(this)
      linearLayout.addView(androidlyButton)

      androidlyButton = Button(this)
      androidlyButton.apply {
          layoutParams = LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT)
          text = "RESET"
          textSize = 20f
          setTextColor(ContextCompat.getColor(this@MainActivity, R.color.colorPrimaryDark))
          id = R.id.btnReset
          setOnLongClickListener {
              txtCounter.text = 0.toString()
              true
          }
      }
      androidlyButton.setOnClickListener(this)
      linearLayout.addView(androidlyButton)

  }

  override fun onClick(v: View?) {
      when (v?.id) {
          R.id.btnDouble -> {
              txtCounter.text = (txtCounter.text.toString().toInt() * 2).toString()
          }
          R.id.btnReset -> {
              txtCounter.text = (-100).toString()
          }
          else -> {
          }
      }
  }

  fun addOne(view: View) {
      txtCounter.text = (txtCounter.text.toString().toInt() + 1).toString()
  }
}

重要事项:

  • import kotlinx.android.synthetic.main.activity_main。
    *语句自动从我们类中的xml获取视图ID。
    因此,可以避免使用findViewById。

  • 当单击" btnIncrementByOne"时,将触发" fun addOne(view:View)"。
    ((view:View))参数必须在函数声明中定义。

  • 以编程方式创建一个Button,并使用以下代码在父视图(此处为LinearLayout)中进行设置。

  • 除了在Button类上调用成员函数外,我们可以使用apply {} lambda表达式。

  • layoutParams用于定义按钮的宽度和高度。
    " MATCH_PARENT"将宽度/高度设置为等于线性布局。
    WRAP_CONTENT将视图包装为内容的大小。

  • 我们可以在res | values | ids.xml下以编程方式设置id。

  • 我们在MainActivity.kt类中定义了View.OnClickListener接口。
    因此,我们需要重写其onClick()函数。

  • 在onclick函数中,我们使用Kotlin when语句,等效于其他语言的切换。

  • 为了触发" onClick"功能,您必须使用context("this")带有接口的按钮上注册" setOnClickListener"。