控件
线性布局(LinearLayout)
常用属性
android:orientation=“vertical” 线性布局特有
<LinearLayout
android:id="@+id/ll_1"
android:layout_width="200dp"
android:layout_height="200dp"
android:orientation="vertical"
android:background="#000"
android:padding="20dp"
android:layout_marginBottom="20dp">
<View
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ff0033"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="200dp"
android:orientation="horizontal"
android:background="#0066ff"
android:layout_marginRight="15dp"
android:layout_marginLeft="15dp">
<View
android:layout_width="0dp"
android:layout_height="match_parent"
android:background="#000000"
android:layout_weight="1"/>
<View
android:layout_width="0dp"
android:layout_height="match_parent"
android:background="#ff0033"
android:layout_weight="2"/>
<View
android:layout_width="0dp"
android:layout_height="match_parent"
android:background="#333"
android:layout_weight="3"/>
</LinearLayout>
相对布局(RelativeLayout)
常用属性
<View
android:id="@+id/view_1"
android:layout_width="100dp"
android:layout_height="100dp"
android:background="#000" />
<View
android:id="@+id/view_2"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_toRightOf="@+id/view_1"
android:background="#ff0033" />
<View
android:id="@+id/view_3"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_below="@+id/view_1"
android:background="#ddd" />
<LinearLayout
android:id="@+id/ll_11"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_below="@+id/view_3"
android:background="#0066ff"
android:orientation="horizontal"
android:padding="10dp">
<View
android:layout_width="100dp"
android:layout_height="match_parent"
android:background="#ff0033" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#000"
android:padding="15dp">
<View
android:id="@+id/view_4"
android:layout_width="100dp"
android:layout_height="match_parent"
android:background="#ff9900" />
<View
android:id="@+id/view_5"
android:layout_width="100dp"
android:layout_height="match_parent"
android:background="#ff9900"
android:layout_toRightOf="@+id/view_4"
android:layout_marginLeft="10dp"/>
</RelativeLayout>
</LinearLayout>
TextView
文字大小,颜色
<TextView
android:id="@+id/tv_2"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="你真TM是个人才"
android:textColor="#000"
android:textSize="24sp"/>
一行显示不下使用 …
<TextView
android:maxLines="1"
android:ellipsize="end" />
文字 + icon
<TextView
android:text="筛选"
android:drawableRight="@drawable/icon_arrowdown"/>
中划线,下划线
1、添加中划线:
首先找到要添加中划线的textView:
<TextView
android:id="@+id/tv_4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="你是铸币"
android:textColor="#000"
android:textSize="24sp"/>
然后再对应的activity中设置
// 声明TextView
private TextView myTextView_4;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_text_view);
// 找到对应id的TextView
myTextView_4 = findViewById(R.id.tv_4);
// 设置中划线
myTextView_4.getPaint().setFlags(Paint.STRIKE_THRU_TEXT_FLAG);
// 去除锯齿
myTextView_4.getPaint().setAntiAlias(true);
}
2、添加下划线:
首先找到要添加下划线的TextView:
<TextView
android:id="@+id/tv_5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="你是铸币"
android:textColor="#000"
android:textSize="24sp"/>
然后再对应的activity中设置
private TextView myTextView_5;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_text_view);
// 找到对应id的TextView
myTextView_5 = findViewById(R.id.tv_5);
// 设置下划线
myTextView_5.getPaint().setFlags(Paint.UNDERLINE_TEXT_FLAG);
}
跑马灯
<TextView
android:id="@+id/tv_6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="你是铸币你是铸币你是铸币你是铸币你是铸币你是铸币你是铸币你是铸币"
android:textColor="#000"
android:textSize="24sp"
android:singleLine="true"
android:ellipsize="marquee"
android:marqueeRepeatLimit="marquee_forever"
android:focusable="true"
android:focusableInTouchMode="true"/>
Button
文字大小、颜色
<Button
android:id="@+id/btn_1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="按钮1"
android:textSize="24sp"
android:textColor="#0066ff"
android:background="#ff0033"/>
自定义背景形状
首先设置控件
<Button
android:id="@+id/btn_2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="按钮2"
android:textSize="24sp"
android:textColor="#0066ff"
android:background="@drawable/bg_btn2" <!--路径-->
android:layout_below="@+id/btn_1"
android:layout_marginTop="10dp"/>
<Button
android:id="@+id/btn_3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="按钮3"
android:textSize="24sp"
android:textColor="#0066ff"
android:background="@drawable/bg_btn3"
android:layout_below="@+id/btn_2"
android:layout_marginTop="10dp"/>
然后再res >drawable 目录下创建 shape bg_btn2.xml 、bg_btn3.xml 文件
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<!--实心-->
<solid
android:color="#ff9900"/>
<!--圆角-->
<corners
android:radius="5dp"/>
</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"
android:color="#ff9900"/>
<!--圆角-->
<corners
android:radius="5dp"/>
</shape>
自定义按压效果
首先设置控件
<Button
android:id="@+id/btn_4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="按钮4"
android:textSize="24sp"
android:textColor="#0066ff"
android:background="@drawable/bg_btn4"
android:layout_below="@+id/btn_3"
android:layout_marginTop="10dp"/>
然后再res >drawable 目录下创建 selector 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="#cc7a00"/>
<corners android:radius="5dp"/>
</shape>
</item>
<!--按钮为被按压时状态-->
<item android:state_pressed="false">
<shape>
<solid android:color="#ff9900"/>
<corners android:radius="5dp"/>
</shape>
</item>
</selector>
点击事件
第一种方法
首先
public void showToast(View view){
Toast.makeText(this,"我被点击了",Toast.LENGTH_SHORT).show();
}
设置控件
<Button
android:id="@+id/btn_4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="按钮4"
android:textSize="24sp"
android:textColor="#0066ff"
android:background="@drawable/bg_btn4"
android:layout_below="@+id/btn_3"
调用方法
android:onClick="showToast"
android:layout_marginTop="10dp"/>
第二种方法
<Button
android:id="@+id/btn_3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="按钮3"
android:textSize="24sp"
android:textColor="#0066ff"
android:background="@drawable/bg_btn3"
android:layout_below="@+id/btn_2"
android:layout_marginTop="10dp"/>
再activuty中设置
// 声明控件
private Button myBtn_3;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_button);
// 找到对应id的button
myBtn_3 = findViewById(R.id.btn_3);
// 设置点击事件
myBtn_3.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(ButtonActivity.this,"Btn3我被点击了",Toast.LENGTH_SHORT).show();
}
});
}
EditText
常用属性
<EditText
android:id="@+id/et_1"
android:layout_width="match_parent"
android:layout_height="50dp"
android:textColor="#FFAD33"
android:textSize="16sp"
android:hint="用户名"
android:background="@drawable/bg_username"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:drawableLeft="@drawable/user"
android:maxLines="1"
android:layout_marginTop="50dp"/>
事件监听
private EditText myEdtUsername;
myEdtUsername = findViewById(R.id.et_1);
// 设置监听事件
myEdtUsername.addTextChangedListener(new TextWatcher() {
@Override
public void beforeTextChanged(CharSequence s, int start, int count, int after) {
}
@Override
public void onTextChanged(CharSequence s, int start, int before, int count) {
Log.d("editText",s.toString());
}
@Override
public void afterTextChanged(Editable s) {
}
});
制作简单登录界面
<EditText
android:id="@+id/et_1"
android:layout_width="match_parent"
android:layout_height="50dp"
android:textColor="#FFAD33"
android:textSize="16sp"
android:hint="用户名"
android:background="@drawable/bg_username"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:drawableLeft="@drawable/user"
android:maxLines="1"
android:layout_marginTop="50dp"/>
<EditText
android:id="@+id/et_2"
android:layout_width="match_parent"
android:layout_height="50dp"
android:textColor="#FFAD33"
android:textSize="16sp"
android:hint="密码"
android:inputType="textPassword"
android:layout_below="@+id/et_1"
android:layout_marginTop="15dp"
android:background="@drawable/bg_username"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:drawableLeft="@drawable/password"
android:maxLines="1"/>
<Button
android:id="@+id/btn_login"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_below="@+id/et_2"
android:layout_marginTop="30dp"
android:text="登录"
android:textColor="#ffffff"
android:textSize="18sp"
android:background="@drawable/bg_btn4"/>
RadioButton(单选框)
常见属性
<RadioGroup
android:id="@+id/rg_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<RadioButton
android:id="@+id/rb_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="男"
android:checked="true"
android:textSize="18sp"
android:textColor="#ff6600"/>
<RadioButton
android:id="@+id/rb_2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="女"
android:textSize="18sp"
android:textColor="#ff6600"/>
</RadioGroup>
自定义样式
<RadioGroup
android:id="@+id/rg_2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_below="@+id/rg_1"
android:layout_marginTop="40dp">
<RadioButton
android:id="@+id/rb_3"
android:layout_width="60dp"
android:layout_height="30dp"
android:text="男"
android:gravity="center"
android:button="@null"
android:checked="true"
android:background="@drawable/bg_radio_button"
android:textSize="18sp"
android:textColor="#000"/>
<RadioButton
android:id="@+id/rb_4"
android:layout_width="60dp"
android:layout_height="30dp"
android:text="女"
android:gravity="center"
android:button="@null"
android:background="@drawable/bg_radio_button"
android:textSize="18sp"
android:textColor="#000"
android:layout_marginLeft="10dp"/>
</RadioGroup>
drawable中的文件 bg_radio_button.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!--按钮被按压时状态-->
<item android:state_checked="true">
<shape>
<solid android:color="#cc7a00"/>
<corners android:radius="5dp"/>
</shape>
</item>
<!--按钮为被按压时状态-->
<item android:state_checked="false">
<shape>
<stroke android:width="1dp"
android:color="#cc7a00"/>
<corners android:radius="5dp"/>
</shape>
</item>
</selector>
监听事件
private RadioGroup myRg1;
myRg1 = findViewById(R.id.rg_1);
myRg1.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(RadioGroup group, int checkedId) {
RadioButton radioButton = group.findViewById(checkedId);
Toast.makeText(RadioButtonActivity.this,radioButton.getText(),Toast.LENGTH_SHORT).show();
}
});
CheckBox(复选框)
常用属性
<CheckBox
android:id="@+id/cb_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="android"
android:textSize="18sp"
android:layout_below="@+id/tv_title"/>
<CheckBox
android:id="@+id/cb_2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="IOS"
android:textSize="18sp"
android:layout_below="@+id/cb_1"/>
自定义样式
<CheckBox
android:id="@+id/cb_5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="编程"
android:button="@drawable/bg_check_box"
android:paddingLeft="10dp"
android:textSize="18sp"
android:layout_marginTop="10dp"/>
<CheckBox
android:id="@+id/cb_6"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="做饭"
android:paddingLeft="10dp"
android:button="@drawable/bg_check_box"
android:textSize="18sp" />
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/ic_checkbox_false" android:state_checked="false"/>
<item android:drawable="@drawable/ic_checkbox_true" android:state_checked="true" />
</selector>
事件监听
private CheckBox mCb5;
private CheckBox mCb6;
mCb5 = findViewById(R.id.cb_5);
mCb6 = findViewById(R.id.cb_6);
mCb5.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
Toast.makeText(CheckBoxActivity.this,isChecked?"5选中":"5未选中",Toast.LENGTH_SHORT).show();
}
});
mCb6.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
Toast.makeText(CheckBoxActivity.this,isChecked?"6选中":"6未选中",Toast.LENGTH_SHORT).show();
}
});
ImageView
基本属性
<ImageView
android:id="@+id/iv_1"
android:layout_width="200dp"
android:layout_height="100dp"
android:background="#ff9900"
android:src="@drawable/iron_man"
android:scaleType="fitXY"
android:layout_marginBottom="10dp"/>
android:scaleType="fitXY"
fitXY # 撑满控件,宽高比可能会发生改变
fitCenter # 保持宽高比缩放,直至能够完全显示
centerCrop # 保持宽高比缩放,直至完全覆盖控件,裁剪显示
加载网络图片
在 build.gradle 文件中添加
repositories {
google()
mavenCentral()
}
dependencies {
implementation 'com.github.bumptech.glide:glide:4.12.0'
annotationProcessor 'com.github.bumptech.glide:compiler:4.12.0'
}
<ImageView
android:id="@+id/iv_4"
android:layout_width="200dp"
android:layout_height="100dp"
android:scaleType="centerCrop"
android:layout_below="@+id/iv_3"/>
private ImageView myIv4;
myIv4 = findViewById(R.id.iv_4);
Glide.with(this)
.load("https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png")
.into(myIv4);
加载网络图片要设置权限
在 AndroidManifest.xml 文件中添加
<uses-permission android:name="android.permission.INTERNET"/>
ListView(列表视图)
首先在 activity_main中
<Button
android:id="@+id/btn_listView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="ListView"
android:textAllCaps="false"/>
然后创建 ListViewActivity
public class ListViewActivity extends AppCompatActivity {
private ListView myLv1;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_list_view);
myLv1 = findViewById(R.id.lv_1);
myLv1.setAdapter(new MyListAdapter(ListViewActivity.this));
myLv1.setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
Toast.makeText(ListViewActivity.this,"点击 pos:"+position,Toast.LENGTH_SHORT).show();
}
});
myLv1.setOnItemLongClickListener(new AdapterView.OnItemLongClickListener() {
@Override
public boolean onItemLongClick(AdapterView<?> parent, View view, int position, long id) {
Toast.makeText(ListViewActivity.this,"长按 pos:"+position,Toast.LENGTH_SHORT).show();
return true;
}
});
}
}
创建 MyListAdapter
public class MyListAdapter extends BaseAdapter {
private Context context;
private LayoutInflater mLayoutInflater;
public MyListAdapter(Context context){
this.context = context;
mLayoutInflater = LayoutInflater.from(context);
}
@Override
public int getCount() {
return 10 ;
}
@Override
public Object getItem(int position) {
return null;
}
@Override
public long getItemId(int position) {
return 0;
}
static class ViewHolder{
public ImageView imageView;
public TextView tvTitle,tvTime,tvContent;
}
@Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder holder = null;
if(convertView == null){
convertView = mLayoutInflater.inflate(R.layout.layout_list_item,null);
holder = new ViewHolder();
holder.imageView = convertView.findViewById(R.id.iv);
holder.tvTitle = convertView.findViewById(R.id.tv_title_list);
holder.tvTime = convertView.findViewById(R.id.tv_time);
holder.tvContent = convertView.findViewById(R.id.tv_content);
convertView.setTag(holder);
}else {
holder = (ViewHolder) convertView.getTag();
}
// 给控件赋值
holder.tvTitle.setText("这是标题");
holder.tvTime.setText("2021-12-09");
holder.tvContent.setText("这是内容");
Glide.with(context).load("https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png").into(holder.imageView);
return convertView;
}
}
<ListView
android:id="@+id/lv_1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:listSelector="@drawable/list_item"/>
GridView(网格视图) 同上
ScrollView
HorizontalScrollView
RecyclerView
首先在 Activity_Main.xml文件中添加一个按钮
<Button
android:id="@+id/btn_RecyclerView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="RecyclerView"
android:textAllCaps="false"/>
然后再 MainActivity 注册点击事件 ,跳转到 RecyclerViewActivity
<Button
android:id="@+id/btn_linear"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="列表视图"/>
注册点击事件,跳转到vLinearRecyclerViewActivity 页面
private Button myBtnLinear;
myBtnLinear = findViewById(R.id.btn_linear);
myBtnLinear.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Intent intent = new Intent(RecyclerViewActivity.this,LinearRecyclerViewActivity.class);
startActivity(intent);
}
});
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/rv_main"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorGray"/>
然后在进行注册点击事件
private RecyclerView myRvMain;
myRvMain = findViewById(R.id.rv_main);
myRvMain.setLayoutManager(new LinearLayoutManager(LinearRecyclerViewActivity.this));
myRvMain.addItemDecoration(new MyDecoration());
myRvMain.setAdapter(new LinearAdapter(LinearRecyclerViewActivity.this, new LinearAdapter.OnItemClickListener() {
@Override
public void onClick(int pos) {
Toast.makeText(LinearRecyclerViewActivity.this,"click"+pos,Toast.LENGTH_SHORT).show();
}
}));
// 设置分割线
class MyDecoration extends RecyclerView.ItemDecoration{
@Override
public void getItemOffsets(@NonNull Rect outRect, @NonNull View view, @NonNull RecyclerView parent, @NonNull RecyclerView.State state) {
super.getItemOffsets(outRect, view, parent, state);
outRect.set(0,0,0,getResources().getDimensionPixelOffset(R.dimen.dividerHeight));
}
}
创建 LinearAdapter
package com.example.helloworld.recyclerView;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
import androidx.annotation.NonNull;
import androidx.recyclerview.widget.RecyclerView;
import com.example.helloworld.R;
public class HorAdapter extends RecyclerView.Adapter<HorAdapter.LinearViewHolder> {
private Context context;
private OnItemClickListener listener;
public HorAdapter(Context context, OnItemClickListener listener){
this.context = context;
this.listener = listener;
}
@NonNull
@Override
public HorAdapter.LinearViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
return new LinearViewHolder(LayoutInflater.from(context).inflate(R.layout.layout_linear_item,parent,false));
}
@Override
public void onBindViewHolder(@NonNull HorAdapter.LinearViewHolder holder, final int position) {
holder.textView.setText("Hello");
holder.itemView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
listener.onClick(position);
// Toast.makeText(context,"click..."+position,Toast.LENGTH_SHORT).show();
}
});
}
@Override
public int getItemCount() {
return 30;
}
class LinearViewHolder extends RecyclerView.ViewHolder{
private TextView textView;
public LinearViewHolder(@NonNull View itemView) {
super(itemView);
textView = itemView.findViewById(R.id.tv_title_linear);
}
}
public interface OnItemClickListener{
void onClick(int pos);
}
}
WebView
private WebView myWv;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_web_view);
myWv = findViewById(R.id.wv);
// 加载本地html文件
// myWv.loadUrl("file:///android_asset/love.html");
// 加载网络url
myWv.getSettings().setJavaScriptEnabled(true);
myWv.setWebViewClient(new WebViewClient());
myWv.setWebChromeClient(new MyWebChromeClient());
myWv.loadUrl("http://m.baidu.com");
}
class MyWebViewClient extends WebViewClient{
@Override
public boolean shouldOverrideUrlLoading(WebView view, WebResourceRequest request) {
view.loadUrl(request.getUrl().toString());
return true;
}
@Override
public void onPageStarted(WebView view, String url, Bitmap favicon) {
super.onPageStarted(view, url, favicon);
Log.d("webView","onPageStarted...");
}
@Override
public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url);
Log.d("webView","onPageFinished...");
}
}
class MyWebChromeClient extends WebChromeClient{
@Override
public void onProgressChanged(WebView view, int newProgress) {
super.onProgressChanged(view, newProgress);
}
@Override
public void onReceivedTitle(WebView view, String title) {
super.onReceivedTitle(view, title);
setTitle(title);
}
}
@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
if(keyCode == KeyEvent.KEYCODE_BACK && myWv.canGoBack()){
myWv.goBack();
return true;
}
return super.onKeyDown(keyCode, event);
}
}