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
, ImageView
and Button
, which are usually TextView
used to display text, ImageView
to display pictures, and Button
to respond to user clicks. However TextView
, ImageView
there are also setOnClickListener()
methods, so you can use TextView
and ImageView
replace Button
to 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:
TextView
, the width of the entire screen, and the height of 50%, the chat content will be added randomly after clicking.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.xml
The 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:
2. Writing of code files
MainActivity.java
The 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 TextView
private variable and a ImageView
variable 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 TextView
Studio ImageView
.
Ouyang Shen. Android Studio Development Practice. Tsinghua University Press. 2017. ↩︎
(Android: click to change picture series 1) Click to change pictures through ImageView