Android开发 |
您所在的位置：网站首页 › 安卓来电界面 › Android开发 |
Android开发
|
AS开发——APP门户界面设计01
内容简介需求分析UI设计topcontentbottom
后端功能设计topcontentbottom
代码模块讲解layoutactivity_main.xmlbottom.xml
MainAvticityonCreateinitFragmenthideFragmentshowFragmentonClick
fragment.java文件
最终展示效果AS项目上传giteegit下载及安装gitee创建项目仓库AS本地项目拉取至gitee仓库中
内容简介
源码地址：https://gitee.com/liu_peilin/android-development-learning 1.实现APP门户界面框架设计，至少包含4个tab页，能实现tab页之间的点击切换； 2.使用布局（layouts）和分段（fragment），对控件进行点击监听 3.使用git将项目传至gitee。 需求分析 UI设计以手机微信主界面为例： 应将主界面分为三个版块，top,content,bottom； 在top版块应该展示出该主界面的标题，即wechat，在AS中，可在layout使用textview部件居中展示该文字效果。 content在该板块，应该能够根据底部功能栏的切换而随之切换。因此，在AS中，可以使用FrameLayout实现该功能，在FrameLayout中包含四个fragment部件对应四个功能栏即可。 bottom 在bottom版块中，进一步分析应将其水平划分为四个LinearLayout，在每一个LinearLayout中应该再垂直划分为两个LinearLayout，如下图所示： 该版块在本项目中固定为wechat，因此不做改变。 content该版块应能监听到bottom栏的点击事件，以此来切换该板块所展示的fragment。 bottom在该板块中，应该设置将四个水平方向上的LinearLayout设置点击监听事件，以此来改变content板块中的fragment 代码模块讲解 layout activity_main.xml引入其他的xml文件应使用include语法； 该界面的整体布局应该是vertical LinearLayout。 bottom.xml下面代码以单个水平方向上的LinearLayout为例： imagView在此即为图标展示部件，具体图标可在iconfont官网下载。 需要将LinearLayout设置为可点击，否则无法监听到点击事件 MainAvticity onCreate通过findViewById函数来找到创建各个fragment的对象，以便之后通过代码对四个fragment对象进行控制；又通过setOnClickListener函数对四个fragment对象设置点击监听事件。 @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); supportRequestWindowFeature(Window.FEATURE_NO_TITLE); setContentView(R.layout.activity_main); LinearLayout1 = findViewById(R.id.LinearLayout_weixinFragment); LinearLayout2 = findViewById(R.id.LinearLayout_weixinContacts); LinearLayout3 = findViewById(R.id.LinearLayout_weixinFind); LinearLayout4 = findViewById(R.id.LinearLayout_weixinMe); LinearLayout1.setOnClickListener(this); LinearLayout2.setOnClickListener(this); LinearLayout3.setOnClickListener(this); LinearLayout4.setOnClickListener(this); initFragment();#初始化fragment showFragment(0);#展示weixinFragment页面 } initFragment顾名思义，初始化fragment，FragmentTransaction可对fragment部件进行添加，替换，移除等操作 private void initFragment(){ fragmentManager = getFragmentManager(); FragmentTransaction transaction = fragmentManager.beginTransaction(); transaction.add(R.id.content,weixinFragment); transaction.add(R.id.content,weixinContacts); transaction.add(R.id.content,weixinFind); transaction.add(R.id.content,weixinMe); transaction.commit(); } hideFragment隐藏所有的fragment部件。 public void hideFragment(FragmentTransaction transaction){ transaction.hide(weixinFragment); transaction.hide(weixinContacts); transaction.hide(weixinFind); transaction.hide(weixinMe); } showFragment通过switch函数，以及transaction的show方法对四个fragment执行切换操作，当i变化时，所显示的fragment也随之变化 private void showFragment(int i){ FragmentTransaction transaction = fragmentManager.beginTransaction(); hideFragment(transaction); switch (i){ case 0: transaction.show(weixinFragment); textView1.setText("WX"); textView2.setText("通讯录"); textView3.setText("发现"); textView4.setText("个人"); break; case 1: transaction.show(weixinContacts); textView1.setText("聊天"); textView2.setText("WC"); textView3.setText("通讯录"); textView4.setText("个人"); break; case 2: transaction.show(weixinFind); textView1.setText("聊天"); textView2.setText("通讯录"); textView3.setText("WF"); textView4.setText("个人"); break; case 3: transaction.show(weixinMe); textView1.setText("聊天"); textView2.setText("通讯录"); textView3.setText("发现"); textView4.setText("WM"); break; default: break; } transaction.commit(); } onClick在写setOnClickListener函数时执行onClick的复写方法，通过监听所点击LinearLayout的id，来执行showFragment展示所对应的Fragment页面。 @Override public void onClick(View v) { switch (v.getId()){ case R.id.LinearLayout_weixinFragment: showFragment(0); break; case R.id.LinearLayout_weixinContacts: showFragment(1); break; case R.id.LinearLayout_weixinFind: showFragment(2); break; case R.id.LinearLayout_weixinMe: showFragment(3); break; default: break; } } fragment.java文件要将fragment装换成对象进行控制，需要创建fragment.java文件 以weixinFragment为例： package com.example.mywechat; import android.os.Bundle; import android.app.Fragment; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; public class weixinFragment extends Fragment { public weixinFragment() { // Required empty public constructor } @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { // Inflate the layout for this fragment return inflater.inflate(R.layout.fragment_weixin, container, false); } } 最终展示效果
具体安装教程可见链接：https://blog.csdn.net/mukes/article/details/115693833 gitee创建项目仓库 具体选项如下图所示，然后点击创建即可： 1.创建一个git repository
4.如下图所示，将AS项目提交至本地仓库 |
点击后，选择自己的本地项目文件夹 2.如下图所示，将自己的本地项目添加到暂存区 
3.如下图所示，对远程仓库地址进行管理： 
将自己的git仓库中的https连接复制之后填入AS中的URL，name默认为origin。 
5.由于第一次push之前需要进行pull操作，因此，应在terminal命令行执行pull操作（可能会遇到合并冲突的情况，需要将AS项目自身所带的冲突文件（我的是.gitignore文件）删除后，再次提交，再进行pull操作即可） 
如果未显示master分支，可以再terminal命令行执行git pull origin master --allow-unrelated-histories命令 6.执行push操作即可完成 
7.查看是否push完成 
项目文件都在即push完成。【本文地址】
今日新闻 |
推荐新闻 |