Android Studio --- > [学习笔记]Button、TextView、EditText
16lz
2021-01-23
说明
- 源代码
- 为了更全面的了解RN,先熟悉一下Android开发
第1章 Android 初体验
1.1 Android开发概述
- Android是Google开发的操作系统
- Android开发是移动应用开发的表现形式之一(Android、IOS、H5 App、Native + H5、 RN、ionic、MUI…)
1.2 Android开发工具
- Android Studio
- 为什么使用Android Studio?
- Android Studio是Google自己推出的Android集成开发工具,且Google已经停止对Eclipse的支持.
1.3 第一个Android应用
- Everything begin with Hello World!
- Android Studio最大的特定是使用Gradle来构建项目…
[部分目录说明]
res: 存放资源drawable: 图片layout: 布局文件mipmap-hdpi: logo图片values: 颜色、文字AndroidMainfest.xml: 应用里面用到的所有内容,都需要在这个里面注册一下
[部分代码说明]
src/main/java/com.skypan.helloworld/MainActivity内的函数setContentView(R.layout.activity_main):表示,使用了activity_main布局- 打开
activity_main.xml,将标签名改为如下:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" />LinearLayout>TextView android:text="Hello World": 显示在手机上的值为Hello World
第2章 UI组件
2.1 布局管理器
- 线性布局(LinearLayout)
- 相对布局(RelativeLayout)
- 以上两种占了接近百分之99
LinearLayout(线性布局)
[最常用属性]:
android:id: 控件的idandroid:layout_width: 布局的宽度android:layout_height: 布局的高度android:background: 布局的背景颜色android:layout_margin: 布局的左右边距android:layout_padding: 布局的内侧边距android:orientation: 布局的方向dp: 根据屏幕自己算出大小match_parent: 匹配父元素android: gravity= "bottom": 控件子元素的排列方式weight: 权重,占父元素宽度(剩余)的权重.相当于flex布局中子元素的属性flex:1; 把剩余内容按照权重去分配
[小结]:
- 通过Android Studio新建的项目,入口文件是
/app/src/main/java/com.skypan.helloworld/MainActivity
class MainActivity : AppCompatActivity() { override fun onCreate (saveInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.activity_main) }}- 其中
setContentView使用到了activity_main:总体的布局样式
2.1.2 RelativeLayout(相对布局)
[最常见属性]:
android:layout_toLeftOf: 在谁左边android:layout_toRightOf: 在谁右边android:layout_alignBottom: 跟谁底部对齐android:layout_alignParentBottom: 跟父元素底部对齐android:layout_below: 在谁的下面
[栗子]:
- 靠父元素右下角对齐
<RelativeLayout> <View android:id="@+id/view_1" android:layout_width="100dp" android:layout_height="100dp" android:background="#000000" android:layout_alignParentBottom="true" android:layout_alignParentRight="true" /></RelativeLayout>- View2相对于View1的右边对齐
<RelativeLayout> <View android:id="@+id/view_1" android:layout_width="100dp" android:layout_height="100dp" android:background="#000000" /> <View android:id="@+id/view_2" android:layout_width="100dp" android:layout_height="100dp" android:background="#FF0033" android:layout_toRightOf="@id/view_1" /></RelativeLayout>2.2 TextView
- 文字大小、颜色
- 显示不下使用…
- 文字 + icon
- 中划线、下划线
[栗子]:
- 1.写一个宽度随父元素,高度等于文本高度的按钮控件
<LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <Button android:id="@+id/btn_textview" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="TextView"/></LinearLayout>- 2.点击Button类实现跳转
// MainActivity.javaimport andoridx.appcompat.app.AppCompatActivity;import android.content.Intent;import android.os.Bundle;public class MainActivity extends AppCompatActivity { // 声明 button private Button mBtnTextView; @override pretected void onCreate(Bundle saveInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); mBtnTextView = (Button) findViewById(R.id.btn_textview); mBtnTextView.setOutClickListener(new View.OnClickListener() { @Override public void onClick(View v) { // 跳转到TextView演示界面 Intent intent = new Intent(packageContext: MainActivity.this, TextViewActivity.class); startActivity(intent); } }) }}- 3.能在MainActivity中使用TextViewActivity的原因
AndroidMainfest.xml配置如下:
<application android:allowBckup="true" ... android:name=".MainActivity"> <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> intent-filter> activity>>- 4.Java操作的TextView:
android:id="@+id/tv_4"
// TextViewActivity.javaimport androidx.appcompat.app.AppCompatActivity;import android.widget.TextView;import android.os.Bundle;public class TextViewActivity extends AppCompatActivity { private TextView mTv4; @override protected void onCreate (Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_text_view); // 获取 id.tv_4 mTv4 = (TextView) findViewById(R.id.tv_4); // 给 id.tv_4划线 mTv4.getPaint().setFlags(Paint.STRING_THRU_TEXT_FLAG); // 去锯齿 mTv4.getPaint().setAntiAlias(true) }}2.3 Button
- 文字大小、颜色
- 自定义背景形状
- 自定义按压效果
- 点击事件
Button样式(简单)
- activity_main.xml
<Button android:id="@+id/btn_button" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="Button" android:layout_marginTop="10dp" />使用java操作控件
// MainActivity.java// 声明控件private Button mBtnButton// 找到按钮 btn_buttonmBtnButton = (Button) findViewById(R.id.btn_button);// 给 mBtnButton 添加点击事件mBtnButton.setOnClickListener(new View.OnClickListener(){ // 点击按钮后执行的操作})实现跳转
import andoirdx.appcompat.app.AppCompatActivity;import andoird.widget.Button;import android.content.Intent;public class MainActivity extends AppCompatActivity { // 声明button private Button mBtnButton; @override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); // 找到按钮 mBtnButton = (Button) findViewById(R.id.btn_button); mBtnButton.setOnClickListener(new View.OnClickListener() { @ovrride public void onClick(View v) { // 跳转到 Button 演示界面 Intent intent = new Intent( packageContext: MainActivity.this, ButtonActivity.class); startActivity(intent); } }) }}做一个矩形的按钮
- 1.在res/drawable -> New -> Drawable resource file -> btn_2.xml
- 代码如下:
<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <solid android:color="#ffffff" /> <corners android:radius="15dp" />按压效果
- res/drawable/bg_btn4.xml
- 样式
<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:state_pressed="true"> <shape> <solid android:color="#cc7c00" /> <corners android:radius="15dp" /> shape> item> <item android:state_pressed="false"> <shape> <solid android:color="#ff9900"> <corners android:radius="15dp" /> shape> item>selector>- 引用如下
activity_button.xml
<Button android:id="@+id/btn_4" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@id/btn_3" android:layout_marginTop="5dp" android:text="Button 4" android:textSize="20sp" android:textColor="#0066ff" android:background="@drawable/bg_btn4" />点击按钮,响应Toast
- 假设有按钮如下:
activity_button.xml
<Button ... android:onClick="showToast" />- 对应Java文件
ButtonActivity.java中加入如下:
public void showToast(View view) { Toast.makeText(context: this, text:'点击', Toast.LENGTH_SHORT).show();}[报错]:
Could not find method showToast(View) in a parent or ancestor Context for android: 写按钮触发事件的时候,没有传入参数View view,将public void showToast()改为public void showToast(View view)
点击按钮,响应Toast[方法2]
- [核心方法] :
Button.setOnClickListener() - 假设有按钮如下:
activity_button.xml
<Button android:id="@+id/btn_3" ..../>- 对于的Java文件
ButtonActivity.java中加入如下:
import androidx.appcompat.app.AppCompatActivity;import android.os.Bundle;import android.widget.Button;import android.widget.Toast;import android.view.View;public class ButtonActivity extends AppCompatActivity { private Button mBtn3; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); mBtn3 = (Button) findViewById(R.id.btn_3); mBtn3.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { Toast.makeText(ButtonActivity.this, 'btn3被点击', Toast.LENGTH_SHORT).show(); } }) }}给TextView控件添加点击事件
- TextView控件
activity_button.xml,如下:
<TextView android:id="@+id/tv_1" .../>- 在Java中获取控件,并设置点击事件
ButtonActivity.java
import androidx.appcompat.app.AppCompatActivity;import android.os.Bundle;import android.widget.TextView;import android.widget.Toast;import android.view.View;public class ButtonActivity extends AppCompatActivity { private TextView mTv1; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); // tv_1的点击事件 mTv1 = (TextView) findViewById(R.id.tv_1); mTv1.setOnClickListener(new View.OnClickListener(){ @Override public void onClick(View v) { Toast.makeText(ButtonActivity.this, "TextView被点击", Toast.LENGTH_SHORT).show(); } }) }}2.4 EditText(输入控件)
- 常用属性
- 监听事件
- 制作登录界面
2.4.1 加一个跳转页面的按钮
- 按钮样式:
activity_main.xml
<Button android:id="@+id/btn_edittext" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="EditText" android:textAllCaps="false"/>- 按钮的点击事件:
MainActivity.java
import androidx.appcompat.app.AppCompatActivity;import android.os.Bundle;import android.context.Intent;import android.widget.Button;import android.view.View;public class MainActivity extends AppCompatActivity { // 声明button private Button mBtnEditText; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); // 找到 btn_edittext mBtnEditText = (Button) findViewById(R.id.btn_edittext); mBtnEditText.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { // 跳转到 EditText 界面 // 这里先假设有 EditTextActivity Intent intent = new Intent(MainActivity.this, EditTextActivity.class); startActivity(intent); } }); }}- 按钮的活动页面:
activity_edit_text.xml
<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android/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" android:padding="15dp"> <EditText android:id="@+id/et_1" android:layout_width="match_parent" android:layout_height="50dp" android:textSize="16sp" android:textColor="#ffad33" android:hint="用户名"/> <EditText android:id="@+id/et_2" android:layout_width="match_parent" android:layout_height="50dp" android:layout_below="@id/et_1" android:hint="密码" android:inputType="textPassword" android:layout_marginTop="5dp" />RelativeLayout>- 给用户名输入框
activity_edit_text.xml加样式 - 输入控件如下
<EditText android:id="@+id/et_1" ... android:background="@drawable/bg_username"/>- 在res/drawable -> New -> Drawable resource file -> bg_username.xml(shape)
- 写入形状如下:
<?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <stroke android:width="1dp" andorid:color="#999999" /> <corners android:radius="5dp"/>更多相关文章
- Android Text控件之属性：android:textAppearance
- 【Android】常见布局xml参数详解
- 【Android】利用Android的网格布局写一个简单的计算器
- 项目中那些事|控件之TextView
- Android布局管理器总结
- 相对布局属性