首页 > 专利查询

安卓开发之前端

安卓开发之前端界⾯的搭建

前段时间因为⽹络编程这门课要做⼀个课程project，题⽬是本地服务器的开发，需要开发⼀个安卓客户端，于是就把去年⼩学期学的那点安卓知识捡起来了（⼼累）

想到去年⼩学期学的那点安卓真的不算什么，就是⼀些很简单的东西，所以为了做好这次前端，努⼒学了很多安卓的前端搭建知识，毕竟是数媒⼈，在前端上可不能输给其他专业的（哼~）

这次的安卓开发需求⽐较简单，要求的功能不多因此界⾯也没有⼏个。

界⾯清单

连接服务器界⾯

登录界⾯

注册界⾯

⾸页界⾯

消息界⾯

社区界⾯

设置界⾯

联系⼈界⾯

添加好友界⾯

好友聊天界⾯

社区消息编辑界⾯

添加联系⼈界⾯

有些界⾯其实差不多，基本上要⽤到以下⼀些组件：

按钮Button

⽂本显⽰TextView

⽂本域Text Field

图表charts

⼯具条toolbar

浮动按钮fab

列表ListView

页⾯切换Tab

刷新

接下来我就介绍⼀些组件的使⽤

⼀、开发环境

Android Studio2.0

Android Studio 是⼀个Android集成开发⼯具，基于IntelliJ IDEA. 类似 Eclipse ADT，Android Studio 提供了集成的 Android 开发⼯具⽤于开发和调试。

我以前⽤的是eclipse with ADT进⾏开发的，现在安卓开发基本上主流的就是这两种IDE，eclipse是⽼牌的java IDE，⾃然也⽀持安卓开发。我⽤eclipse的时候觉得他对界⾯的可视化编辑⽐较差，⽽且开模拟器会很卡，然后这次决定采⽤AS进⾏开发，AS对界⾯的可视化编辑⽀持⽐较好，模拟器⽐较快（我⼀般是⽤真机调试）但是打代码的时候总有⼀种我在写C++的错觉…

还有要说的⼀点是，eclipse和AS的项⽬结构是不⼀样的！在eclipse⾥⾯⼀个project就是⼀个app，但是在AS⾥⾯project不是app的意思，⽽是⼀个项⽬的意思，这个项⽬底下可以有多个app同时存在，当你运⾏的时候要选择运⾏哪个app。AS在侧边栏可以⽀持多种⽂件结构视图，通常我是看Android 视图，这样⼦看起来就和eclipse的结构差不多了。

蒸纱锅

关于⽂件结构、⽂件功能我就不多说了，⽹上有很多⼊门资料。

⼆、定制⾃⼰的ToolBar

通常新建⼀个项⽬安卓会⾃动的给你界⾯加上⼀个丑丑的toolbar，⽽且不好改他的功能，因为有时候我们需要在toolbar加上按钮来跳转，所以为了解决这个问题我们可以定制⾃⼰的toolbar。

先看⼀下效果：

这是统⼀模板：建⽴⼀个layout⽂件，layout_l

代码如下：

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="schemas.android/apk/res/android"

android:orientation="vertical"

android:layout_width="match_parent"

android:layout_height="wrap_content">

<RelativeLayout

android:id="@+id/toolbar_content_rlyt"

android:layout_width="match_parent"

android:layout_height="50dp"

android:paddingLeft="15dp"

android:paddingRight="15dp"

android:background="@color/bg_toolbar">

<Button

android:id="@+id/toolbar_left_btn"

android:layout_width="25dp"

android:layout_height="25dp"

android:layout_alignParentLeft="true"

android:padding="50dp"

android:gravity="center"

android:layout_centerVertical="true"

android:background="#00000000"

android:visibility="invisible"/>

<TextView

android:id="@+id/toolbar_left_tv"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_toRightOf="@id/toolbar_left_btn"

android:gravity="center"

android:layout_centerVertical="true"

android:textColor="#fff"

android:textSize="15sp"

android:text="返回"

android:visibility="gone"

<TextView

android:id="@+id/toolbar_title_tv"

android:layout_width="wrap_content"

android:layout_height="match_parent"

android:gravity="center"

android:layout_centerInParent="true"

android:singleLine="true"

android:text="标题"

android:textSize="20sp"

android:textColor="#fff"

android:maxEms="10"

android:visibility="invisible"/>

<LinearLayout

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_alignParentRight="true"

android:layout_toRightOf="@id/toolbar_title_tv" android:layout_centerVertical="true">

<Button

android:id="@+id/toolbar_right_btn"

android:layout_width="25dp"

android:layout_height="25dp"

android:gravity="center"

android:layout_marginLeft="70dp"

android:visibility="invisible"

android:background="#00000000"

android:textSize="15sp"

android:textColor="#fff"/>

<TextView

android:id="@+id/toolbar_right_tv"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:gravity="center"

android:layout_marginLeft="70dp"

android:textColor="#fff"

android:textSize="15sp"

android:text="更多"

android:visibility="gone"/>

<Button

android:id="@+id/toolbar_right_btn2"

android:layout_width="25dp"

android:layout_height="25dp"

android:layout_marginLeft="25dp"

android:gravity="center"

android:visibility="invisible"

android:background="#00000000"

android:textSize="15sp"

android:textColor="#fff"/>

<TextView

android:id="@+id/toolbar_right_tv2"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:gravity="center"

android:textColor="#fff"

android:textSize="15sp"

android:text="更多2"

android:visibility="gone"/>

</LinearLayout>

</RelativeLayout>

<View

android:layout_width="match_parent"

android:layout_height="0.5dp"

android:background="#AAAAAA"

</LinearLayout>

可以看到我在这个统⼀模板⾥⾯设定了三个按钮可供跳转：左边的按钮通常⽤来退出，右边有两个按钮可以根据具体需要只⽤⼀个或两个，当然你也可以多加⼏个

消防正压送风口为了在每个页⾯调⽤这个统⼀模板，我们需要写⼀个java⽂件，CustomToolBar

ample.bpapp.view;

t.Context;

t.res.TypedArray;

import android.util.AttributeSet;

湖水净化import android.view.View;

import android.widget.Button;

import android.widget.LinearLayout;

import android.widget.RelativeLayout;

import android.widget.TextView;

刹车锅

ample.bpapp.bpapp.R;

/**

* Created by ningrun on 2017/5/31.

public class CustomToolBar extends LinearLayout {

private Boolean isLeftBtnVisible;

private int leftResId;

private Boolean isLeftTvVisible;

private String leftTvText;

private Boolean isRightBtnVisible;

private int rightResId;

private Boolean isRightTvVisible;

private String rightTvText;

private Boolean isRightBtnVisible2;

private int rightResId2;

private Boolean isRightTvVisible2;

private String rightTvText2;

private Boolean isTitleVisible;

private String titleText;

private int backgroundResId;

public CustomToolBar(Context context) {

this(context, null);

}

public CustomToolBar(Context context, AttributeSet attrs) {

this(context, attrs, 0);

}

pvc瑜伽垫public CustomToolBar(Context context, AttributeSet attrs, int defStyleAttr) {

super(context, attrs, defStyleAttr);

initView(attrs);

}

/**

* 初始化属性

* @param attrs

public void initView(AttributeSet attrs) {

TypedArray typedArray = getContext().obtainStyledAttributes(attrs, R.styleable.CustomToolBar); /**-------------获取左边按钮属性------------*/液晶屏保护膜

isLeftBtnVisible = Boolean(R.styleable.CustomToolBar_left_btn_visible, false);

leftResId = ResourceId(R.styleable.CustomToolBar_left_btn_src, -1);

/**-------------获取左边⽂本属性------------*/

isLeftTvVisible = Boolean(R.styleable.CustomToolBar_left_tv_visible, false);

if (typedArray.hasValue(R.styleable.CustomToolBar_left_tv_text)) {

leftTvText = String(R.styleable.CustomToolBar_left_tv_text);

}

/**-------------获取右边按钮属性------------*/

isRightBtnVisible = Boolean(R.styleable.CustomToolBar_right_btn_visible, false); rightResId = ResourceId(R.styleable.CustomToolBar_right_btn_src, -1);

/**-------------获取右边⽂本属性------------*/

isRightTvVisible = Boolean(R.styleable.CustomToolBar_right_tv_visible, false);

if (typedArray.hasValue(R.styleable.CustomToolBar_right_tv_text)) {

rightTvText = String(R.styleable.CustomToolBar_right_tv_text);

}

/**-------------获取右边按钮2属性------------*/

isRightBtnVisible2 = Boolean(R.styleable.CustomToolBar_right_btn_visible2, false); rightResId2 = ResourceId(R.styleable.CustomToolBar_right_btn_src2, -1);

/**-------------获取右边⽂本2属性------------*/

isRightTvVisible2 = Boolean(R.styleable.CustomToolBar_right_tv_visible2, false); if (typedArray.hasValue(R.styleable.CustomToolBar_right_tv_text2)) {

rightTvText2 = String(R.styleable.CustomToolBar_right_tv_text2);

}

/**-------------获取标题属性------------*/

isTitleVisible = Boolean(R.styleable.CustomToolBar_title_visible, false);

if (typedArray.hasValue(R.styleable.CustomToolBar_title_text)) {

titleText = String(R.styleable.CustomToolBar_title_text);

}

/**-------------背景颜⾊------------*/

backgroundResId = ResourceId(R.styleable.CustomToolBar_barBackground, -1); le();

/**-------------设置内容------------*/

View barLayoutView = View.inflate(getContext(), R.layout.layout_common_toolbar, null);

Button leftBtn = (Button) barLayoutView.findViewById(lbar_left_btn);

TextView leftTv = (TextView) barLayoutView.findViewById(lbar_left_tv);

TextView titleTv = (TextView) barLayoutView.findViewById(lbar_title_tv);

Button rightBtn = (Button) barLayoutView.findViewById(lbar_right_btn);

TextView rightTv = (TextView) barLayoutView.findViewById(lbar_right_tv);

Button rightBtn2 = (Button) barLayoutView.findViewById(lbar_right_btn2);

TextView rightTv2 = (TextView) barLayoutView.findViewById(lbar_right_tv2);

RelativeLayout barRlyt = (RelativeLayout) barLayoutView.findViewById(lbar_content_rlyt);

if (isLeftBtnVisible) {

leftBtn.setVisibility(VISIBLE);

}

if (isLeftTvVisible) {

leftTv.setVisibility(VISIBLE);

}

if (isRightBtnVisible) {

rightBtn.setVisibility(VISIBLE);

}

if (isRightTvVisible) {

rightTv.setVisibility(VISIBLE);

本文发布于:2024-09-22 20:24:47，感谢您对本站的认可！

本文链接：https://www.17tex.com/tex/4/277368.html

上一篇：APK测试

下一篇：解析Android中如何做到Service被关闭后又自动启动的实现方法

标签：开发按钮对界

留言与评论（共有 0 条评论）