Learning "Android Studio Development Practice" (4) - Click Response of TextView and ImageView

Learning "Android Studio Development Practice" (4) - Click Response of TextView and ImageView


foreword

This article records the author's experience in learning Android Studio to develop App 1 . The most basic controls provided by Android Studio are TextView, ImageViewand Button, which are usually TextViewused to display text, ImageViewto display pictures, and Buttonto respond to user clicks. However TextView, ImageViewthere are also setOnClickListener()methods, so you can use TextViewand ImageViewreplace Buttonto implement the function of responding to user clicks.

Now I want to design a simple interface that responds to user clicks, from top to bottom are:

  1. TextView, the width of the entire screen, and the height of 50%, the chat content will be added randomly after clicking.
  2. ImageView, the width of the entire screen, and the height of 50%, change the picture content in an orderly manner after clicking.

1. Writing the layout file

activity_main.xmlThe full code is as follows:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"
    tools:context=".MainActivity">
    <androidx.constraintlayout.widget.Guideline
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/guideline_1"
        app:layout_constraintGuide_percent=".50"
        android:orientation="horizontal"/>
    <TextView
        android:id="@+id/tv_bbs"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:gravity="center"
        android:text="点我增加聊天内容。"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="@+id/guideline_1" />
    <ImageView
        android:id="@+id/iv_scale"
        android:layout_width="match_parent"
        android:layout_height="400dp"
        android:src="@color/white"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="@+id/guideline_1"
        app:layout_constraintBottom_toBottomOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

In order to realize percentage layout, method 2 of adding guideline (Guideline) can be used in ConstraintLayout . In this simple interface, a horizontal auxiliary line is added at the position of 0.50, and then the two controls are limited by the auxiliary line. as the picture shows:
Learning "Android Studio Development Practice" (9) - Click Response of TextView and ImageView - Page Layout


2. Writing of code files

MainActivity.javaThe full code is as follows:

package com.example.textviewclick;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.*;
import android.view.View;
import android.view.View.*;
import android.text.method.ScrollingMovementMethod;
import java.text.SimpleDateFormat;
import java.util.Date;
public class MainActivity extends AppCompatActivity {
    
    
    private ImageView iv_scale;
    private TextView tv_bbs;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
    
    
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        tv_bbs = findViewById(R.id.tv_bbs);
        tv_bbs.setMovementMethod(new ScrollingMovementMethod());
        iv_scale = findViewById(R.id.iv_scale);
        iv_scale.setOnClickListener(new ClickTAction());
        tv_bbs.setOnClickListener(new ClickCAction());
        tv_bbs.setOnLongClickListener(new ClickLAction());
    }
    private class ClickTAction implements OnClickListener {
    
    
        private int flag = 0;
        @Override
        public void onClick(View v) {
    
    
            if (v.getId() == R.id.iv_scale) {
    
    
                flag = (flag + 1) % 3;
                if (flag == 0) {
    
    
                    iv_scale.setImageResource(android.R.color.holo_blue_bright);
                } else if (flag == 1) {
    
    
                    iv_scale.setImageResource(android.R.color.holo_red_dark);
                } else if (flag == 2) {
    
    
                    iv_scale.setImageResource(android.R.color.holo_green_dark);
                }
            }
        }
    }
    private final String[] mChatStr = {
    
    "您用餐了吗?",
            "今天是个好日子。",
            "我赢了!",
            "我们去看电影,好吗?",
            "我晚上做什么好呢?" };
    private class ClickCAction implements OnClickListener {
    
    
        @Override
        public void onClick(View v) {
    
    
            if (v.getId() == R.id.tv_bbs) {
    
    
                int r = (int)(Math.random()*10) % 5;
                String s = String.format("%s\n%s %s", tv_bbs.getText().toString(), getNowTime(), mChatStr[r]);
                tv_bbs.setText(s);
            }
        }
    }
    private class ClickLAction implements OnLongClickListener {
    
    
        @Override
        public boolean onLongClick(View v) {
    
    
            if (v.getId() == R.id.tv_bbs) {
    
    
                tv_bbs.setText("");
            }
            return true;
        }
    }
    private String getNowTime() {
    
    
        SimpleDateFormat s = new SimpleDateFormat("HH:mm:ss");
        return s.format(new Date());
    }
}

Create a TextViewprivate variable and a ImageViewvariable here, onCreate()use findViewById()the method to correspond to the two controls designed above, and then use setOnClickListener()the method to bind the click listener on the control.

The method 3ImageView is adopted for the user to click on the image to change the content of the image .setImageResource()


Summarize

The above is what I want to talk about today. This article briefly introduces the implementation of the click response function in Android TextViewStudio ImageView.


  1. Ouyang Shen. Android Studio Development Practice. Tsinghua University Press. 2017. ↩︎

  2. androidx.percentlayout.widget | Android Developers ↩︎

  3. (Android: click to change picture series 1) Click to change pictures through ImageView

Guess you like

Origin blog.csdn.net/quanet_033/article/details/125209972