Android Studio 版本
Android Java TextView 实现 点击事件 参考
Dart
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.TextView;
import android.widget.Toast;
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initListener();
}
private void initListener(){
TextView textView=findViewById(R.id.textView);
textView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Log.i("MainActivity","TextView 被点击了!!!");
}
});
}
}
Android Kotlin TextView 实现 点击事件 参考
Dart
import android.os.Bundle
import android.util.Log
import android.widget.TextView
import androidx.appcompat.app.AppCompatActivity
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
initListener()
}
private fun initListener() {
val textView = findViewById<TextView>(R.id.textView)
textView.setOnClickListener { Log.i("MainActivity", "TextView 被点击了!!!") }
}
}
Android Compose Text 实现 点击事件 参考
导入依赖包
Dart
dependencies {
......
implementation ("androidx.activity:activity-compose:1.3.1")
implementation("androidx.compose.material:material:1.4.3")
implementation("androidx.compose.ui:ui-tooling:1.4.3")
}
启用Compose功能
Dart
import android.os.Bundle
import android.util.Log
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.text.font.FontStyle
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
class MainActivity : ComponentActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContent {
showTextView()
}
}
@Preview
@Composable
private fun showTextView() {
Box(
modifier = Modifier
.fillMaxWidth()
.height(200.dp)
.background(Color(0xff6200EE)), contentAlignment = Alignment.Center
) {
Text(
text = "Android Compose TextView",
fontSize = 20.sp,
fontStyle = FontStyle.Normal,
modifier = Modifier.clickable {
Log.i("MainActivity", "TextView 被点击了!!!!")
},
textAlign = TextAlign.Center,
color = Color(0xffffffff),
)
}
}
}
Xcode 版本
IOS Object-c UITextView 点击事件 参考
IOS SWift UITextView 点击事件
Flutter Text 点击事件 参考
Dart
GestureDetector(
onTap: () {
if (kDebugMode) {
print('Flutter Text 点击事件......');
}
},
child: Text(
'Flutter Text 点击事件',
style: TextStyle(fontSize: 18.sp),
),
)
点击 pub get
鸿蒙 Text 点击事件 参考
Dart
import hilog from '@ohos.hilog'
@Entry
@Component
struct Index {
@State message: string = 'HarmonyOs Text 点击事件'
build() {
Column() {
Text(this.message)
.fontSize(20)
.fontWeight(FontWeight.Bold)
.width('100%')
.onClick(() => {
hilog.info(0x0000, 'IndexTag', '%{public}s', 'HarmonyOs Text 点击事件!!!')
})
.height('100%')
.textAlign(TextAlign.Center)
}.height('100%')
.width('100%')
}
}
打开后出现如下情况点击 Migrate Assistant
点击预览 Preview
ReactNative Text 点击事件 参考
Dart
import React from 'react';
import {AppRegistry,Text,StyleSheet,Alert} from 'react-native';
import App from './App';
import {name as appName} from './app.json';
const textClick = () => {
return (
<Text
onPress={() => {
Alert.alert('你点击了按钮!');
}}
style={styles.text} >点击我</Text>
);
};
const styles = StyleSheet.create({
text: {
with:'100%', // 宽度
height:100, // 高度
textAlign: 'center', // 水平居中
backgroundColor: '#ffcc00', // 设置背景颜色
textAlignVertical: 'center', // 垂直居中
},
});
AppRegistry.registerComponent(appName, () => textClick);
执行 npm install 安装项目所需要的依赖
运行到安卓
采用 npx react-native run-android 或npm start 运行
运行到IOS平台
采用 npx react-native run-ios 或npm start 运行
切换到iOS目录从新安装依赖
Dart
// 清除缓存
pod cache clean --all
//移出本地 pod文件依赖
pod deintegrate
//执行安装显示下载信息
pod install --verbose --no-repo-update