总结1链接:
(156条消息) Android Studio应用基础,手把手教你从入门到精通(小白学习)总结1_好喜欢吃红柚子的博客-CSDN博客
学习视频链接:
(学完必会)Android studio基础,从入门到精通,学完小白也能会_哔哩哔哩_bilibili
目录
1.2 layout_gravity:决定控件在布局中的对齐方式
2.2 根据其他控件定位的位置属性
五、常见界面布局
1. LinearLayout布局
LinearLayout布局的语法格式为
<LinearLayout 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"
android:orientation="horizontal"
>
……
</LinearLayout>
1.1 orientation属性:决定控件的排列方式
android:orientation="horizontal" 或者 “vertical”
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
android:orientation="horizontal"
>
horizontal 水平排列 vertical 垂直排列
如果不指定orientation的值,默认排列方式是horizontal。
- 若排列方式为horizontal,则不能指定宽度为match-parent,因为一个按钮的宽度就会把整个屏幕占满,出现下图1所示情况
- 若排列方式为vertical,则不能指定高度为match-parent,因为一个按钮的高度就会把整个屏幕占满,出现下图2所示情况
1 2
1.2 layout_gravity:决定控件在布局中的对齐方式
<Button
android:id="@+id/b1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:text="按钮1"
/>
<Button
android:id="@+id/b2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text="按钮2"
/>
<Button
android:id="@+id/b3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:text="按钮3"
/>
效果:
1.3 gravity:决定文字在控件中的对齐方式
- 把button2的文字对齐方式改为bottom
- android:gravity="right|bottom" 组合使用
<Button
android:id="@+id/b2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:gravity="bottom"
android:text="按钮2"
/>
效果:
1.4 weight 权重
(1)作用:可以使布局内的控件按照权重比显示大小,起到屏幕适配的重要作用
因为使用了权重weight属性,所以可以将控件的宽度设置为0dp,此时的宽度由权重值决定
(2)应用:
- 设置两个控件的权重均为1,则屏幕会按1:1比例为控件分配大小
<EditText
android:id="@+id/input1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:hint="请输入信息"></EditText>
<Button
android:id="@+id/send"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="发送"
/>
效果如下图1所示。
- 设置输入框的权重为1,设置按钮的宽度为wrap-content,则可如图2效果所示,为常用的手机布局设置。
<EditText
android:id="@+id/input1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:hint="请输入信息"></EditText>
<Button
android:id="@+id/send"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="发送"
/>
1 2
2. RelativeLayout相对布局
语法如下:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
>
</RelativeLayout>
2.1 根据布局定位的位置属性
为5个按钮分别设置不同的页面效果。
- android:layout_alignParentLeft="true" 设置当前控件与父布局左对齐
- android:layout_alignParentTop="true" 设置当前控件与父布局顶端对齐
- android:layout_centerInParent="true" 设置当前控件位于父布局的中央位置
<Button
android:id="@+id/b1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:text="按钮1"></Button>
<Button
android:id="@+id/b2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:text="按钮2"></Button>
<Button
android:id="@+id/b3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="按钮3"></Button>
<Button
android:id="@+id/b4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:text="按钮4"></Button>
<Button
android:id="@+id/b5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:text="按钮5"></Button>
效果:
2.2 根据其他控件定位的位置属性
让按钮1,2,4,5根据按钮3进行位置的排列
- android:layout_above="@+id/b3" 此控件在b3之上
- android:layout_toLeftOf="@+id/b3" 此控件在b3左边
- android:layout_below="@+id/b3" 此控件在b3之下
- android:layout_toRightOf="@+id/b3" 此控件在b3右边
<Button
android:id="@+id/b1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@+id/b3"
android:layout_toLeftOf="@+id/b3"
android:text="按钮1"></Button>
<Button
android:id="@+id/b2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@+id/b3"
android:layout_toRightOf="@+id/b3"
android:text="按钮2"></Button>
<Button
android:id="@+id/b3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="按钮3"></Button>
<Button
android:id="@+id/b4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/b3"
android:layout_toLeftOf="@+id/b3"
android:text="按钮4"></Button>
<Button
android:id="@+id/b5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/b3"
android:layout_toRightOf="@+id/b3"
android:text="按钮5"></Button>
效果:
3. ConstraintLayout布局
语法格式如下:
<?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.ConstraintLayout>
4. 自定义布局
4.1 自定义布局的书写
- 新建一个布局文件title.xml,导入需要的按钮和背景的图片,把自定义标题栏写好
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:background="@drawable/bb3">
<Button
android:id="@+id/title_back"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1"
android:background="@drawable/bb1"
android:gravity="center"
android:text="Back"
android:textColor="#ffff"></Button>
<TextView
android:id="@+id/title_text"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="title text"
android:textColor="#fff"
android:textSize="24sp"></TextView>
<Button
android:id="@+id/title_edit"
android:layout_width="0"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_margin="5dp"
android:background="@drawable/bb2"
android:gravity="center"
android:text="edit"
android:textColor="#ffff"></Button>
</LinearLayout>
- 在写标题栏过程中为防止出现控件文字不显示问题,把values文件夹目录下的themes.xml文件改为如下语句。
<resources xmlns:tools="http://schemas.android.com/tools">
<!-- Base application theme. -->
<style name="Theme.Layout" parent="Theme.MaterialComponents.DayNight.DarkActionBar.Bridge">
<!-- Primary brand color. -->
<item name="colorPrimary">@color/purple_500</item>
<item name="colorPrimaryVariant">@color/purple_700</item>
<item name="colorOnPrimary">@color/white</item>
<!-- Secondary brand color. -->
<item name="colorSecondary">@color/teal_200</item>
<item name="colorSecondaryVariant">@color/teal_700</item>
<item name="colorOnSecondary">@color/black</item>
<!-- Status bar color. -->
<item name="android:statusBarColor" tools:targetApi="l">?attr/colorPrimaryVariant</item>
<!-- Customize your theme here. -->
</style>
</resources>
效果如下(有点丑)
4.2 在主布局中引用自定义布局
在main_activity.xml文件中插入如下语句:
<!-- 引入自定义布局--> <include layout="@layout/title" ></include>
表示将自定义布局引入该布局中。
效果如下:
4.3 隐藏系统自带标题栏
在main_activity.java中使用ActionBar完成对系统标题栏的隐藏,具体使用方法后续会讲解~
package cn.edu.sdut.layout;
import androidx.appcompat.app.ActionBar;
import androidx.appcompat.app.AppCompatActivity;
import android.app.Notification;
import android.os.Bundle;
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ActionBar actionBar = getSupportActionBar();
if(actionBar!=null){
actionBar.hide();
}
}
}
成功隐藏系统标题栏:
5、TableLayout行列布局
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="@+id/login"
android:gravity="center"
android:layout_centerInParent="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/loginTxt"/>
<TableLayout
android:layout_above="@+id/login"
android:shrinkColumns="0"
android:stretchColumns="1"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_marginLeft="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/name">
</TextView>
<EditText
android:id="@+id/txt_user"
android:layout_marginRight="10dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</TableRow>
<TableRow
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_marginLeft="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/psw">
</TextView>
<EditText
android:id="@+id/txt_psw"
android:layout_marginRight="10dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</TableRow>
</TableLayout>
</RelativeLayout>
六、水平和竖直滚动条
1. HorizentalScrollView 水平滚动条
水平滚动条只能包含一个视图,因此不能直接把多个按钮放进去,所以需要先新建一个linear布局的视图,把五个按钮放进去,再把linear布局放在水平滚动条内,即可
- 结构:
<?xml version="1.0" encoding="utf-8"?> 1. 第一层:线性布局大框架 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="match_parent" > 2.第二层:水平滚动条部件 <HorizontalScrollView android:layout_width="wrap_content" android:layout_height="wrap_content"> 3. 第三层:线性布局容器,用来装按钮 <LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="horizontal"> 4. 放置多个按钮 </LinearLayout> </HorizontalScrollView> </LinearLayout>
- 代码:
<?xml version="1.0" encoding="utf-8"?>
<!--
权重:控制宽度
-->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<!-- 水平滚动条只能包含一个视图,所以需要先新建一个linear的视图,把五个按钮放进去,
再把linear放在水平滚动条内,即可-->
<HorizontalScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<!--<!– 使用view给按钮添加间隔–>-->
<!-- <View-->
<!-- android:layout_width="0dp"-->
<!-- android:layout_weight="1"-->
<!-- android:layout_height="wrap_content"></View>-->
<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<Button
android:id="@+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<Button
android:id="@+id/button4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
<Button
android:id="@+id/button5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
</LinearLayout>
</HorizontalScrollView>
</LinearLayout>
2. 垂直滚动条ScrollView
ScrollView在最外层,要有xmlns的这个语句,因为这个语句是唯一的,而且只能且必须加在最外层框架的头标签里。
xmlns:android="http://schemas.android.com/apk/res/android"
结构:
<?xml version="1.0" encoding="utf-8"?> <!--xmlns给scrollview,因为这句话只有最外层的容器有--> 1. ScrollView,在最外层 <ScrollView xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="wrap_content" > 2. 线性布局容器,装按钮 <LinearLayout android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent" > 3. 放置多个按钮 </LinearLayout> </ScrollView>
代码:
<?xml version="1.0" encoding="utf-8"?>
<!--
权重:控制宽度
-->
<!--xmlns给scrollview,因为这句话只有最外层的容器有-->
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<Button
android:layout_width="wrap_content"
android:layout_height="100dp">
</Button>
<Button
android:layout_width="wrap_content"
android:layout_height="100dp">
</Button>
<Button
android:layout_width="wrap_content"
android:layout_height="100dp">
</Button>
<Button
android:layout_width="wrap_content"
android:layout_height="100dp">
</Button>
<Button
android:layout_width="wrap_content"
android:layout_height="100dp">
</Button>
<Button
android:layout_width="wrap_content"
android:layout_height="100dp">
</Button>
<Button
android:layout_width="wrap_content"
android:layout_height="100dp">
</Button>
<Button
android:layout_width="wrap_content"
android:layout_height="100dp">
</Button>
<Button
android:layout_width="wrap_content"
android:layout_height="100dp">
</Button>
</LinearLayout>
</ScrollView>
七、ListView滚动菜单
新建一个名为ListView的项目,完成后续操作。
1. 滚动菜单ListView的简单应用
- 在布局文件中定义一个滚动菜单
<ListView
android:id="@+id/list_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
- 在MainActivity.java文件中进行对显示数据和适配器的定义
String类型的fruit数组存储了菜单想要显示的内容
数组中的数组无法直接传递给ListView,因此需要借助适配器完成,使用ArrayAdapter完成数据对ListView的传输,适配器的构造函数中需要其次传入三个参数:
- 所处的activity
- Android自带的xml文件的构造文字的容器
- 想要输出的内容。
最后使用setAdapter方法给滚动菜单配置上刚刚定义的配适器
package cn.edu.sdut.listview;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ArrayAdapter;
import android.widget.ListView;
public class MainActivity extends AppCompatActivity {
// 数组存取listview想要展示的信息
private String[] fruit ={"apple","banana","orange","watermelon",
"pear","grape","strawberry","cherry","mango","Coconut","tomato","lemon",
"apple","banana","orange","watermelon", "pear","grape","strawberry","cherry",
"mango","Coconut"};
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// 配置适配器
ArrayAdapter<String> adapter = new ArrayAdapter<String>
(MainActivity.this, android.R.layout.simple_list_item_1,fruit);
ListView listView = (ListView) findViewById(R.id.list_view);
listView.setAdapter(adapter);
}
}
效果如下:
2. 定制ListView界面
实现水果图片和对应水果名称匹配一起在滚动列表中显示。
- 新建Fruit.java类,进行水果名和水果图片名称的实体类编写
package cn.edu.sdut.listview;
public class Fruit {
private String name;
private int imageId;
public Fruit(String name, int imageId) {
this.name = name;
this.imageId = imageId;
}
public String getName() {
return name;
}
public int getimageId() {
return imageId;
}
}
- 定义水果适配器FruitAdaptor.java
package cn.edu.sdut.listview;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.ImageView;
import android.widget.TextView;
import java.util.List;
public class FruitAdapter extends ArrayAdapter<Fruit> {
private int resourceId;
public FruitAdapter(Context context, int textViewResourceId, List<Fruit> object){
super(context,textViewResourceId,object);
resourceId = textViewResourceId;
}
public View getView(int position, View coverView, ViewGroup parent){
Fruit fruit = getItem(position);
View view = LayoutInflater.from(getContext()).inflate(resourceId,parent,false);
ImageView fruitImage = (ImageView) view.findViewById(R.id.fruit_image);
TextView fruitName = (TextView) view.findViewById(R.id.fruit_name);
fruitImage.setImageResource(fruit.getimageId());
fruitName.setText(fruit.getName());
return view;
}
}
- 对主活动进行编写MainActivity.java进行编写
1. 新建一个水果类的列表,进行对水果名和水果图片名的存储
2. 使用initFruit方法进行对列表元素的添加
3. 把适配器给滚动列表set上
package cn.edu.sdut.listview;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ArrayAdapter;
import android.widget.ListView;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity {
private List<Fruit> fruitList = new ArrayList<>();
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initFruits();
FruitAdapter adapter = new FruitAdapter(MainActivity.this,R.layout.fruit_item,fruitList);
ListView listView = (ListView) findViewById(R.id.list_view);
listView.setAdapter(adapter);
}
//把水果名称和对应图片加入信息列表
private void initFruits(){
for(int i=0;i<2;i++){
Fruit apple = new Fruit("apple",R.drawable.apple);
fruitList.add(apple);
Fruit banana = new Fruit("banana",R.drawable.banana);
fruitList.add(banana);
Fruit orange = new Fruit("orange",R.drawable.orange);
fruitList.add(orange);
Fruit watermelon = new Fruit("watermelon",R.drawable.watermelon);
fruitList.add(watermelon);
Fruit pear= new Fruit("pear",R.drawable.pear);
fruitList.add(pear);
Fruit grape = new Fruit("grape",R.drawable.grape);
fruitList.add(grape);
Fruit strawberry = new Fruit("strawberry",R.drawable.stawberry);
fruitList.add(strawberry);
Fruit cherry = new Fruit("cherry",R.drawable.cherry);
fruitList.add(cherry);
Fruit mango = new Fruit("mango",R.drawable.mango);
fruitList.add(mango);
Fruit coconut = new Fruit("coconut",R.drawable.coconut);
fruitList.add(coconut);
Fruit tomato = new Fruit("tomato",R.drawable.tomato);
fruitList.add(tomato);
Fruit lemon = new Fruit("lemon",R.drawable.lemon);
fruitList.add(lemon);
}
}
}
效果如下:
3.实现ListView的点击事件
- 使用setOnItemListener方法为滚动菜单设置点击事件
- onItemClick方法参数中的 i 为点击到的具体元素
- 使用toast方法将点击到的水果名弹窗显示
在主活动中添加如下代码
代码:
package cn.edu.sdut.listview;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.ListView;
import android.widget.Toast;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity {
private List<Fruit> fruitList = new ArrayList<>();
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//为fruitList列表添加元素
initFruits();
FruitAdapter adapter = new FruitAdapter(MainActivity.this,R.layout.fruit_item,fruitList);
ListView listView = (ListView) findViewById(R.id.list_view);
listView.setAdapter(adapter);
// 设置点击事件
listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {
Fruit fruit = fruitList.get(i);
Toast.makeText(MainActivity.this,fruit.getName(), Toast.LENGTH_SHORT).show();
}
});
}
//把水果名称和对应图片加入信息列表
private void initFruits(){
// 为了让滚动列表中多显示一些元素,所以添加两遍重复的内容
for(int i=0;i<2;i++){
Fruit apple = new Fruit("apple",R.drawable.apple);
fruitList.add(apple);
Fruit banana = new Fruit("banana",R.drawable.banana);
fruitList.add(banana);
Fruit orange = new Fruit("orange",R.drawable.orange);
fruitList.add(orange);
Fruit watermelon = new Fruit("watermelon",R.drawable.watermelon);
fruitList.add(watermelon);
Fruit pear= new Fruit("pear",R.drawable.pear);
fruitList.add(pear);
Fruit grape = new Fruit("grape",R.drawable.grape);
fruitList.add(grape);
Fruit strawberry = new Fruit("strawberry",R.drawable.stawberry);
fruitList.add(strawberry);
Fruit cherry = new Fruit("cherry",R.drawable.cherry);
fruitList.add(cherry);
Fruit mango = new Fruit("mango",R.drawable.mango);
fruitList.add(mango);
Fruit coconut = new Fruit("coconut",R.drawable.coconut);
fruitList.add(coconut);
Fruit tomato = new Fruit("tomato",R.drawable.tomato);
fruitList.add(tomato);
Fruit lemon = new Fruit("lemon",R.drawable.lemon);
fruitList.add(lemon);
}
}
}
效果: