【Android开发入门】二:更名、换图标、实现主界面
1 修改app 图标和 name
默认app图标特别丑, 假如我们要做一个自己的微信,网上搜索微信的icon,注意一定要下载png格式的图标
因为png有alpha透明通道,这样微信图标可以很容易的和各个手机的背景主题融为一体,
png和jpg的区别可以参考此文章
素材可以从这里下载
下载不同尺寸的微信图标后,我rename 为 icon.png,并放置于 res 下不同的 mipmap文件中
运行在不同分辨率尺寸屏幕的手机上,app会加载不同mipmap目录下的素材
屏幕分辨率与mipmap文件夹对应关系可以参考这里
列出部分内容如下:
1.2 分辨率对应DPI
"HVGA mdpi"
"WVGA hdpi "
"FWVGA hdpi "
"QHD hdpi "
"720P xhdpi"
"1080P xxhdpi "
当前手机大部分屏幕分辨率达1080P,甚至2160P,所以加载的是 mipmap-xxhdpi文件夹下的素材
之后引用其素材即可
在 AndroidManifest.xml中,
改
android:icon="@mipmap/ic_launcher"
为
android:icon="@mipmap/icon"
表示应用的图标是从mipmap文件夹中引用 icon.png 或 icon.jpg 素材,
注意文件夹中不能同时存在 icon.png 和 icon.jpg,否则studio不知道该加载哪个素材。
android:label 表示app的name, 即 android:label="@string/app_name"
从 res/value/strings.xml中引用了 app_name 执行的字符串,我们将"myapplication"改为 “weChat”
2 修改app主界面
真正的微信图标(以下简称”微信“)点击去后是一个漂亮的地球画面,而我们的weChat图标(以下简称“weChat”)点开之后是一片苍茫大地,中书一行大字:Hello World. 额头上还有titleBar: weChat。
2.1 清除titleBar
网上搜了好多文章,都是没有区分
extends AppCompatActivity 和 extends Activity 这两种场景
简单归类一下
2.2.1 二者的由来
在创建project或者 module时,第三步 Configure Activity时,默认有一选项 Backwards Compatibility(AppCompat) 是使能的
创建出的Activity如下:
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
}
而非使能此选项时,创建的Actvity如下:
public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
}
2.2.2 extends AppCompatActivity 场景
2.2.2.1 增加 getSupportActionBar().hide(); 语句即可
public class MainActivity extends AppCompatActivity {
private final static String TAG = "MainActivity";
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
getSupportActionBar().hide();
setContentView(R.layout.activity_main);
}
}
2.2.2.2 改父类 AppCompatActivity 为 Activity
public class MainActivity extends Activity {
private final static String TAG = "MainActivity";
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
}
推荐使用 2.2.2.1 方法, 2.2.2.2是我偶然发现的,风险未知。。
2.2.3 extends Activity 场景
从 AndroidManifest.xml 中可以看出
android:theme="@style/AppTheme"
主界面采用了 syles.xml中的 AppTheme 主题,即
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="android:Theme.Material.Light.DarkActionBar">
<!-- Customize your theme here. -->
</style>
</resources>
我们将 android:theme="@style/AppTheme" 改为 android:theme="@android:style/Theme.NoTitleBar" 即可
网上还有好多其他方法,我就选取了这两种最简单的方法,其他就不一一赘述了。
2.2 设置背景图片
网上找不到质量较高的微信登录图,我直接对微信登录界面采用了截图处理并将原有按键和语言抹去了命名为background.png
放置与res/drawable目录下,并在 avtivity_main.xml中增加背景图设置
android:background="@drawable/background"
效果如下:
2.3 增加按钮以及按钮回调事件
在布局中增加了两个按钮,如下:
xml中代码如下:
<Button
android:id="@+id/login"
android:layout_width="110dp"
android:layout_height="40dp"
android:layout_marginBottom="20dp"
android:layout_marginStart="32dp"
android:background="#66DD22"
android:text="登录"
android:textColor="#FFFFFF"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent" />
<Button
android:id="@+id/register"
android:layout_width="110dp"
android:layout_height="40dp"
android:layout_marginBottom="20dp"
android:layout_marginEnd="32dp"
android:background="#FFFFFF"
android:text="注册"
android:textColor="#000000"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
为啥手机上的布局是这样子呢??
暂时不加右上角的语言了,下一步添加点击按钮跳转新的activity。