【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。
微信登錄界面

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。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章