說明
源代碼 為了更全面的了解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: 控件的id android:layout_width: 布局的寬度 android:layout_height: 布局的高度 android:background: 布局的背景顏色 android:layout_margin: 布局的左右邊距 android:layout_padding: 布局的內側邊距 android:orientation: 布局的方向 dp: 根據屏幕自己算出大小 match_parent: 匹配父元素 <View />: 是所有控件的父類,如<Button /> 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> < Viewandroid
: id
= "@+id/view_1" android
: layout_width
= "100dp" android
: layout_height
= "100dp" android
: background
= "#000000" android
: layout_alignParentBottom
= "true" android
: layout_alignParentRight
= "true" / >
< / RelativeLayout
>
< RelativeLayout> < Viewandroid
: id
= "@+id/view_1" android
: layout_width
= "100dp" android
: layout_height
= "100dp" android
: background
= "#000000" / > < Viewandroid
: 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.寫一個寬度隨父元素,高度等于文本高度的按鈕控件
< LinearLayoutandroid
: layout_width
= "match_parent" android
: layout_height
= "match_parent" android
: orientation
= "vertical" > < Buttonandroid
: id
= "@+id/btn_textview" android
: layout_width
= "match_parent" android
: layout_height
= "wrap_content" android
: text
= "TextView" / >
< / LinearLayout
>
import andoridx
. appcompat
. app
. AppCompatActivity
;
import android
. content
. Intent
;
import android
. os
. Bundle
; public class MainActivity extends AppCompatActivity { 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
) { Intent intent
= new Intent ( packageContext
: MainActivity
. this , TextViewActivity
. class ) ; startActivity ( intent
) ; } } ) }
}
3.能在MainActivity中使用TextViewActivity的原因 AndroidMainfest.xml配置如下:
< applicationandroid: allowBckup= " true" ... <activity 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"
import 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
) ; mTv4
= ( TextView
) findViewById ( R
. id
. tv_4
) ; mTv4
. getPaint ( ) . setFlags ( Paint
. STRING_THRU_TEXT_FLAG
) ; mTv4
. getPaint ( ) . setAntiAlias ( true ) }
}
2.3 Button
文字大小、顏色 自定義背景形狀 自定義按壓效果 點擊事件
Button樣式(簡單)
< Buttonandroid: id= " @+id/btn_button" android: layout_width= " match_parent" android: layout_height= " wrap_content" android: text= " Button" android: layout_marginTop= " 10dp" />
使用java操作控件
private Button mBtnButton
mBtnButton
= ( Button
) findViewById ( R
. id
. btn_button
) ;
mBtnButton
. setOnClickListener ( new View. OnClickListener ( ) {
} )
實現跳轉
import andoirdx
. appcompat
. app
. AppCompatActivity
;
import andoird
. widget
. Button
;
import android
. content
. Intent
; public class MainActivity extends AppCompatActivity { 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
) { 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" > < solidandroid: color= " #ffffff" /> < cornersandroid: 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>
< Buttonandroid: 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
< Buttonandroid: 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,如下:
< TextViewandroid: 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
) ; 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 加一個跳轉頁面的按鈕
< Buttonandroid: 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 { private Button mBtnEditText
; @Override protected void onCreate ( Bundle savedInstanceState
) { super . onCreate ( savedInstanceState
) ; mBtnEditText
= ( Button
) findViewById ( R
. id
. btn_edittext
) ; mBtnEditText
. setOnClickListener ( new View. OnClickListener ( ) { @Override public void onClick ( View v
) { 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" > < EditTextandroid: id= " @+id/et_1" android: layout_width= " match_parent" android: layout_height= " 50dp" android: textSize= " 16sp" android: textColor= " #ffad33" android: hint= " 用戶名" /> < EditTextandroid: 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加樣式 輸入控件如下
< EditTextandroid: 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" > < strokeandroid: width= " 1dp" andorid: color= " #999999" /> < cornersandroid: radius= " 5dp" />
總結
以上是生活随笔 為你收集整理的Android Studio --- [学习笔记]Button、TextView、EditText 的全部內容,希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔 網站內容還不錯,歡迎將生活随笔 推薦給好友。