Article Directory
Android learning records(1)
This article records some of the interfaces I made when I started learning Android for the first time. Because it was the first time I did it, I got very beautiful results, but I also got some effective results.
1. Android related introduction
Before proceeding with new learning content, we need to understand some related content of the course
1.1 What is Android
Android is an open source operating system based on Linux.
Mainly used in smart devices, such as smart phones, tablets, and smart TVs.
It was developed and promoted by Google, and the first version was launched in 2008.
This system was originally developed by "Father of Android" Andy Rubin (2003).
1.2 Using tools (Android Studio)
Android Studio is an Android integrated development tool launched by Google, based on IntelliJ IDEA. Similar to Eclipse ADT, Android Studio provides integrated Android development tools for development and debugging.
In Android Studio, we have a total of three views, namely Project view, Package view and Android view.
1.Android view
2.Project view
3.Packags view
1.3 Android application directory structure
View the Android application directory structure in the Android view. There are three important directories: manifests, java and res. Manifests is the project list directory, java is the JAVA source program directory, and res is the resource directory.
2. Android case (1)
After gaining a preliminary understanding of the knowledge I have learned, I plan to make a case for deeper learning.
In order to better understand the use of linear layout, I used the entry-level linear layout method to complete the first task.
The finished effect is as shown in the figure:
Complete idea: First, in order to achieve this effect, I divided the whole into two parts. First, in the first part, I set the picture as the background of the upper part, and in the second part, I used another A linear layout, in which two text boxes are inserted with rounded rectangles, and a button.
The main codes of related files are as follows:
1.activity_main.xml file
<?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"
android:orientation="vertical"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="@drawable/background"
android:gravity="center"
android:orientation="horizontal">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/bluelogo"
android:layout_gravity="bottom" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="2"
android:background="#c0c0c0"
android:gravity="center"
android:orientation="vertical">
<EditText
android:id="@+id/editText01"
android:layout_width="380dp"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:height="8dp"
android:background="@drawable/editsharp"
android:drawableLeft="@drawable/logo3"
android:drawablePadding="10dp"
android:ems="5"
android:inputType="textImeMultiLine"
android:lines="2"
android:scrollbarStyle="outsideOverlay"
android:scrollbars="vertical"
android:text="@string/username"
android:textColor="#708090" />
<EditText
android:id="@+id/editText02"
android:layout_width="380dp"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:height="8dp"
android:background="@drawable/editsharp"
android:drawableLeft="@drawable/logo4"
android:drawablePadding="10dp"
android:ems="5"
android:inputType="textImeMultiLine"
android:lines="2"
android:paddingTop="1dp"
android:scrollbarStyle="outsideOverlay"
android:scrollbars="vertical"
android:text="@string/password"
android:textColor="#708090" />
<Button
android:layout_width="380dp"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:id="@+id/btnLogin"
android:layout_gravity="center"
android:text="登录"
android:textColor="@color/white"
android:background="#330066"/>
</LinearLayout>
</LinearLayout>
2. Implementation code of rounded rectangle:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<!--<gradient
android:angle="45"
android:endColor="#cccccc"
android:startColor="#cccccc"/>-->
<padding
android:bottom="7dp"
android:left="7dp"
android:right="7dp"
android:top="7dp"/>
<!--设置圆角矩形-->
<corners android:radius="3dp"/>
<stroke
android:color="@color/white"
android:width="25px"/>
<solid android:color="@color/white"/>
</shape>
3. Android case (two)
After completing the linear layout case, I also realized the grid layout case. Although the effect is not very beautiful, it is also a beginner’s experience. The completed effect of case (2) is shown
in the figure: in this case we also used rounded rectangles, and the method used is roughly the same as that of case (1).
Case (2) Completion of the idea: First, we will insert the background as a whole and add other content to it.
The related main code is as follows:
1.activity_main.xml file
<?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"
android:background="@drawable/background"
android:orientation="vertical"
android:gravity="center_horizontal"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="360dp"
android:layout_height="30dp"
android:layout_marginTop="155dp"
android:layout_gravity="center"
android:alpha="0.8"
android:background="@drawable/shape_round_coener"
android:gravity="center">
<TextView
android:layout_width="120dp"
android:layout_height="30dp"
android:background="@drawable/shape_round_coener01"
android:textColor="@color/white"
android:text="@string/part01"
android:layout_marginLeft="1dp"
android:gravity="center"
android:layout_gravity="left"/>
<TextView
android:layout_width="120dp"
android:layout_height="30dp"
android:background="@drawable/shape_round_coener"
android:textColor="#000066"
android:gravity="center"
android:text="@string/part02"
android:layout_gravity="center"/>
<TextView
android:layout_width="120dp"
android:layout_height="30dp"
android:background="@drawable/shape_round_coener"
android:text="@string/part03"
android:textColor="#000066"
android:gravity="center"
android:layout_gravity="right"/>
</LinearLayout>
<LinearLayout
android:layout_width="12dp"
android:layout_height="10dp"
android:background="@drawable/logo"
android:layout_gravity="center_vertical"
android:layout_marginLeft="80dp"/>
<GridLayout
android:layout_width="360dp"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_gravity="center"
android:columnCount="3"
android:rowCount="4">
<LinearLayout
android:layout_width="220dp"
android:layout_height="84dp"
android:layout_columnSpan="2"
android:layout_gravity="fill"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_marginBottom="5dp"
android:background="@drawable/shape_round_coener"
android:gravity="center">
<ImageView
android:layout_width="55dp"
android:layout_height="55dp"
android:background="@drawable/pc1" />
</LinearLayout>
<LinearLayout
android:layout_width="107dp"
android:layout_height="84dp"
android:layout_row="0"
android:layout_column="2"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_marginBottom="5dp"
android:background="@drawable/shape_round_coener"
android:gravity="center">
<ImageView
android:layout_width="55dp"
android:layout_height="55dp"
android:background="@drawable/pc2" />
</LinearLayout>
<LinearLayout
android:layout_width="107dp"
android:layout_height="84dp"
android:layout_row="1"
android:layout_column="0"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_marginBottom="5dp"
android:background="@drawable/shape_round_coener02"
android:gravity="center">
<ImageView
android:layout_width="55dp"
android:layout_height="55dp"
android:background="@drawable/pc3" />
</LinearLayout>
<LinearLayout
android:layout_width="107dp"
android:layout_height="84dp"
android:layout_row="1"
android:layout_column="1"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_marginBottom="5dp"
android:background="@drawable/shape_round_coener02"
android:gravity="center">
<ImageView
android:layout_width="55dp"
android:layout_height="55dp"
android:background="@drawable/pc4" />
</LinearLayout>
<LinearLayout
android:layout_width="107dp"
android:layout_height="84dp"
android:layout_row="1"
android:layout_column="2"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_marginBottom="5dp"
android:background="@drawable/shape_round_coener02"
android:gravity="center">
<ImageView
android:layout_width="55dp"
android:layout_height="55dp"
android:background="@drawable/pc5" />
</LinearLayout>
<LinearLayout
android:layout_width="107dp"
android:layout_height="84dp"
android:layout_row="2"
android:layout_column="0"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_marginBottom="5dp"
android:background="@drawable/shape_round_coener"
android:gravity="center">
<ImageView
android:layout_width="55dp"
android:layout_height="55dp"
android:background="@drawable/pc6" />
</LinearLayout>
<LinearLayout
android:layout_width="107dp"
android:layout_height="84dp"
android:layout_row="2"
android:layout_column="1"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_marginBottom="5dp"
android:background="@drawable/shape_round_coener"
android:gravity="center">
<ImageView
android:layout_width="55dp"
android:layout_height="55dp"
android:background="@drawable/pc7" />
</LinearLayout>
<LinearLayout
android:layout_width="107dp"
android:layout_height="84dp"
android:layout_row="2"
android:layout_column="2"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_marginBottom="5dp"
android:background="@drawable/shape_round_coener"
android:gravity="center">
<ImageView
android:layout_width="55dp"
android:layout_height="55dp"
android:background="@drawable/pc8" />
</LinearLayout>
<LinearLayout
android:layout_width="107dp"
android:layout_height="84dp"
android:layout_row="3"
android:layout_column="0"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_marginBottom="5dp"
android:background="@drawable/shape_round_coener02"
android:gravity="center">
<ImageView
android:layout_width="55dp"
android:layout_height="55dp"
android:background="@drawable/pc9" />
</LinearLayout>
<LinearLayout
android:layout_width="107dp"
android:layout_height="84dp"
android:layout_row="3"
android:layout_column="1"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_marginBottom="5dp"
android:background="@drawable/shape_round_coener02"
android:gravity="center">
<ImageView
android:layout_width="55dp"
android:layout_height="55dp"
android:background="@drawable/pc10" />
</LinearLayout>
<LinearLayout
android:layout_width="107dp"
android:layout_height="84dp"
android:layout_row="3"
android:layout_column="2"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_marginBottom="5dp"
android:background="@drawable/shape_round_coener02"
android:gravity="center">
<ImageView
android:layout_width="55dp"
android:layout_height="55dp"
android:background="@drawable/pc11" />
</LinearLayout>
</GridLayout>
<LinearLayout
android:layout_width="405dp"
android:layout_height="170dp"
android:background="@color/white"
android:gravity="top"
>
<LinearLayout
android:layout_width="135dp"
android:layout_height="20dp"
android:gravity="center"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="@drawable/logo1"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="首页"/>
</LinearLayout>
<LinearLayout
android:layout_width="135dp"
android:layout_height="20dp"
android:gravity="center"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="@drawable/logo2"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="消息"/>
</LinearLayout>
<LinearLayout
android:layout_width="135dp"
android:layout_height="20dp"
android:gravity="center"
>
<ImageView
android:layout_width="21dp"
android:layout_height="20dp"
android:layout_gravity="center"
android:src="@drawable/logo3"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="个人中心"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>