It mainly implements a navigation bar at the bottom. Generally, there is a navigation bar at the bottom of the software, which contains 3-5 items, and switches to different pages when clicked. Like WeChat, you can not only click, but also swipe, and the navigation bar icons will change differently when swiping, imitating this effect. The gradient of the icon color, it is impossible to have so many pictures with different colors. I don't know the principle of WeChat. Here we use a custom View to implement it (I said earlier that the base class of many Android controls is View, then define a class to inherit View and achieve the desired effect, which is a custom control).
Note: Make a screenshot later.
Project name, right-click to create a new package, right-click the package name to create a new class, name QEndBar, select View for Superclass, and confirm. The software has created a new QEndBar.java file and has opened it, but it prompts an error, hovering the mouse, because there is no constructor (the class initialization will be called, and some variables can be initialized), correct the prompt and select the second one (you can find it in the xml), add a constructor. Introduce an important method menu Source→O/I Mothods→onDraw(Canvas):
public class QEndBar extends View {
public QEndBar(Context context, AttributeSet attrs) {
super(context, attrs);
// TODO Auto-generated constructor stub
}
@Override
protected void onDraw(Canvas canvas) {
// TODO Auto-generated method stub
super.onDraw(canvas);
}
}
onDraw (Canvas canvas), the name is the painting, and the View presented on the screen is painted here. Canvas is equivalent to a canvas (an area of the screen). You can call Canvas' drawXXX() to draw various kinds, such as canvas.drawText("Hello, world!", 0, 0, paint); parameters: text, x coordinate, y coordinate, Paint (a brush, you can set different font, color, size, etc.). Define a Paint object Paint paint, initialize paint=new Paint() in the constructor:
public class QEndBar extends View {
private Paint paint;
public QEndBar(Context context, AttributeSet attrs) {
super(context, attrs);
// TODO Auto-generated constructor stub
paint=new Paint();
paint.setTextSize(50);
}
@Override
protected void onDraw(Canvas canvas) {
// TODO Auto-generated method stub
canvas.drawText("Hello, world!", 50, 50, paint);
super.onDraw(canvas);
}
}
The class is defined, referenced in xml, layout/activity_main.xml, imported, like a normal control (but with a specific path (package name)) such as: com.zdphpn.dpnotes.qview.QEndBar:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#000000" >
<com.zdphpn.dpnotes.qview.QEndBar
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_alignParentBottom="true"
android:background="#FFFFFF" />
</RelativeLayout>
The preview may not show the effect (usually, but not complicated), running, "Hello, world!" is displayed in the white area at the bottom of the screen. Why not in the middle, obsessive-compulsive disorder, modify the x, y coordinates canvas.drawText("Hello, world!", getWidth()/2-50*3, getHeight()/2, paint), width/2-3 words , height/2 (in fact, not accurate), check the effect.
Note: Hello, World! is displayed at the bottom of the screen! , different from TextView.
Over time - 2016/10/24