# test2

**Repository Path**: johnny1128/test2

## Basic Information

- **Project Name**: test2
- **Description**: No description available
- **Primary Language**: Kotlin
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2022-05-04
- **Last Updated**: 2022-05-12

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

![输入图片说明](eeecc7bbb270b886bd5b7589128b0f1d_3.png)![输入图片说明](aa0a70b7eba0e4a5309619a87b89ac75_4.png)
![输入图片说明](569691939a0ccb9a9348dae7734859a0_9.png)![输入图片说明](96d2cd72053a2adb4dac7d2bfa46f210_7.png)
![输入图片说明](6a941da02d1e83cc56f41b90e5307e66_5.png)
## 创建第一个Kotlin应用

##### 一、初始工作

* 首先创建一个新工程，并选择basic activity.



* 程序基础框架代码

  

* 然后run一下空程序，查看两个fragment切换的效果.

  !

  点击next-->
![输入图片说明](/eeecc7bbb270b886bd5b7589128b0f1d_3.png)
![输入图片说明](//aa0a70b7eba0e4a5309619a87b89ac75_4.png)


##### 二、设置第一个页面的布局

* 首先添加两个button，原先那个next按钮作为random按钮，其他新添加的两个一个作为toast一个作为count.

* TOAST按钮的布局代码：

  ```
      <Button
          android:id="@+id/toast_button"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:layout_marginStart="24dp"
          android:background="@color/buttonBackground"
          android:text="@string/toast_button_text"
          app:layout_constraintBottom_toBottomOf="parent"
          app:layout_constraintStart_toStartOf="parent"
          app:layout_constraintTop_toBottomOf="@+id/textview_first" />
![输入图片说明](//6a941da02d1e83cc56f41b90e5307e66_5.png)
  ```


* 设置中间textview的布局代码(该框后面作为容纳count按钮累加得到的数字)

  ```
   <TextView
          android:id="@+id/textview_first"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:fontFamily="sans-serif-condensed"
          android:text="@string/hello_first_fragment"
          android:textColor="@android:color/white"
          android:textSize="72sp"
          android:textStyle="bold"
          app:layout_constraintBottom_toBottomOf="parent"
          app:layout_constraintEnd_toEndOf="parent"
          app:layout_constraintStart_toStartOf="parent"
          app:layout_constraintTop_toTopOf="parent" />
  ```

* 添加颜色资源

  ```
      <color name="screenBackground">#2196F3</color>
      <color name="buttonBackground">#BBDEFB</color>
  ```

  一个作为按钮的背景颜色，一个作为第一个fragment的背景颜色.

* 注意，这里必须在style文件内添加".bridge"，不然不会生效.

  ```
      <style name="Theme.Lab2" parent="Theme.MaterialComponents.DayNight.DarkActionBar.Bridge">
  ```

* 代码填充后，第一个fragment的效果图：
![输入图片说明](//aa0a70b7eba0e4a5309619a87b89ac75_4.png)![输入图片说明](b4618f0a9e9f27b9fd3e736f5c0afe22_8.png)

 

##### 三、设置代码自动补全

​	在setting里找到auto import,勾选java和kotlin栏里的add unambiguous imports on the fly


##### 四、添加第一个fragment的按钮相应事件

* 为Toast按钮添加一个toast消息

  ```
   view.findViewById<Button>(R.id.toast_button).setOnClickListener(){
              val myToast = Toast.makeText(context,"Hello Toast!",Toast.LENGTH_LONG)
              myToast.show()
          }
  ```

* 为Count添加更新屏幕数字的功能

  ```
  view.findViewById<Button>(R.id.count_button).setOnClickListener(){
              countMe(view)
          }
  ```

  这里countMe函数需要自己添加

  //计数方法
      private fun countMe(view: View) {
  
          val showCountTextView = view.findViewById<TextView>(R.id.textview_first)
  
  
          val countString = showCountTextView.text.toString()
  
  
          var count = countString.toInt()
  
          count++
  
  
          showCountTextView.text = count.toString()
      }
  
  ```/b4618f0a9e9f27b9fd3e736f5c0afe22_8.png

##### 五、设置第二个页面布局

* 该页面把第一个页面传递过来的数字作为上限，并通过随机数，生成0到该上限数字的任意一个数字.

  效果如下

  点击random-->

 

* 在第二个页面添加一个textview来显示随机数

  ```
    <TextView
          android:id="@+id/textview_header"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:layout_marginStart="24dp"
          android:layout_marginLeft="24dp"
          android:layout_marginTop="24dp"
          android:layout_marginEnd="24dp"
          android:layout_marginRight="24dp"
          android:textColor="@color/colorPrimaryDark"
          android:textSize="24sp"
          android:text="@string/random_heading"
          app:layout_constraintEnd_toEndOf="parent"
          app:layout_constraintStart_toStartOf="parent"
          app:layout_constraintTop_toTopOf="parent" />
  
  
  ```

* 修改初始textview_second来显示随机数范围的提示信息

  ```
   <TextView
          android:id="@+id/textview_random"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:text="R"
          android:textColor="@android:color/white"
          android:textSize="72sp"
          android:textStyle="bold"
          app:layout_constraintBottom_toTopOf="@+id/button_second"
          app:layout_constraintEnd_toEndOf="parent"
          app:layout_constraintStart_toStartOf="parent"
          app:layout_constraintTop_toBottomOf="@+id/textview_header"
          app:layout_constraintVertical_bias="0.45" />
  
  ```

  这里的文本信息：

  ```
      <string name="random_heading">Here is a random number between 0 and %d</string>
  
  ```

* 设置一个按钮回到第一个fragment

  ```
     <Button
          android:id="@+id/button_second"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:text="@string/previous"
          app:layout_constraintBottom_toBottomOf="parent"
          app:layout_constraintEnd_toEndOf="parent"
          app:layout_constraintHorizontal_bias="0.498"
          app:layout_constraintStart_toStartOf="parent" />
  
  ```

* 添加颜色资源

  ```
      <color name="colorPrimaryDark">#3700B3</color>
      <color name="screenBackground2">#26C6DA</color>
  
  ```


##### 六、启用safeArgs

* 这里因为每个人的版本不同，会出现很多问题，我个人的版本是2021.3.1 patch3

* 首先找到project模块下的build.gradle，添加如下信息：

  ```
  dependencies {
          def nav_version = "2.4.2"
          classpath "androidx.navigation:navigation-safe-args-gradle-plugin:$nav_version"
      }
  
  ```

* 然后找到APP模块下的build.gradle，在plugins中添加如下信息：

  ```
      id 'androidx.navigation.safeargs'
  
  ```

##### 七、创建导航动作的参数并更新FirstFragment和secondFragment的响应代码

* 在secondFragment属性栏里找到argument，并添加一个参数myArg,类型为整型integer


* 在FirstFragment中找到randombutton的处理代码，注释掉原先代码：

  ```
  binding.randomButton.setOnClickListener {
              val showCountTextView = view.findViewById<TextView>(R.id.textview_first)
              val currentCount = showCountTextView.text.toString().toInt()
  
              val action = FirstFragmentDirections.actionFirstFragmentToSecondFragment(currentCount)
  
              //findNavController().navigate(R.id.action_FirstFragment_to_SecondFragment)
              findNavController().navigate(action)
          }
  
  ```

* 添加第二个页面的相应代码，这里需要导入navArgs包：

  ```
  import androidx.navigation.fragment.navArgs
  
  ```

  在onViewCreated代码之前添加一行：

  ```
  val args: SecondFragmentArgs by navArgs()
  
  ```

  在onViewCreated中获取传递过来的参数列表，提取count值

  根据count值生成随机数

  textview_random中显示count值
![输入图片说明](//![输入图片说明](/96d2cd72053a2adb4dac7d2bfa46f210_7.png))

  ```
  override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
          super.onViewCreated(view, savedInstanceState)
  
  
  
          val count = args.myArg
          val countText = getString(R.string.random_heading,count)
  
          view.findViewById<TextView>(R.id.textview_header).text = countText
  
          val random = Random()
          var randomNumber = 0
          if(count>0){
              randomNumber = random.nextInt(count + 1)
          }
  
  
          view.findViewById<TextView>(R.id.textview_random).text = randomNumber.toString()
  
  
          binding.buttonSecond.setOnClickListener {
              findNavController().navigate(R.id.action_SecondFragment_to_FirstFragment)
          }
  
  
      }
  
  ```

##### 八、运行程序