VS 2015 开发Android底部导航条[实例代码,多图]
1.废话背景介绍
在Build 2016开发者大会上,微软宣布,Xamarin将被整合进所有版本的Visual Studio之中。
前面都是科普废话,上正文.
2.环境安装
抱着试一试的心态,更新了VS 2015 Updata2, 因为以前就玩过Xamarin,注册了帐号发现升级后还是使用过去,很郁闷 以为微软忽悠我们呢.
试着找找 无意中在Tools --> Options --> Other 里面看到 Xamarin for Visual Studio Updatas
咦这是什么鬼?
点击 Check Now 试试 如图:
等到一段时间, 墙的威力太大,有必要的话请FQ更新.另外Android SDK NDK的安装(什么,你知道怎么安装,请baidu一下)也请FQ,下载镜像可以设置为东软的镜像 mirrors.neusoft.edu.cn
如图:
这些下载更新快多了.
环境这些准备好了.
我们来回归正题.
3.Android底部导航条
终于可以写代码了,开始不了解Xamarin Android的原理,还导出找教程,尼玛最后才知道不管Android还是IOS Xamarin都可以直接使用原生的界面布局加C#语法编译打包.这下简单了找个原生的例子直接使用,略加翻译Java-->C#即可,Java C#相似度极高. 聪明的你们肯定一看就会.以下实例本人均翻译至Java的实例.
简单说说原理,主要使用TabActivity TabHost Intent. 你问我他们分别是干什么的? 呃!~~~ 这个可以将一本书了, 用了你就知道了.
现在 TabActivity据说已经过时 Fragment已取代了他.有兴趣的朋友可以试试,找个例子改改.
TabActivity在API 13(Android 3.2)被标记为过期,需要使用Fragment来实现,Fragment是Android 3.0引入的一个概念,主要就是为了适应各种不同的屏
先上张效果图,这是最终要实现的样子:
开始建工程
这个大家都会吧,不多说.
创建Maintabs.axml
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@android:id/tabhost"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<FrameLayout
android:id="@android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="0.0dip"
android:layout_weight="1.0" />
<TabWidget
android:id="@android:id/tabs"
android:visibility="gone"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0.0" />
<RadioGroup
android:gravity="center_vertical"
android:layout_gravity="bottom"
android:orientation="horizontal"
android:id="@+id/main_radio"
android:background="@drawable/maintab_toolbar_bg"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<RadioButton
android:id="@+id/radio_button0"
android:layout_marginTop="2.0dip"
android:text="@string/main_home"
android:drawableTop="@drawable/icon_1_n"
style="@style/main_tab_bottom" />
<RadioButton
android:id="@+id/radio_button1"
android:layout_marginTop="2.0dip"
android:text="@string/main_news"
android:drawableTop="@drawable/icon_2_n"
style="@style/main_tab_bottom" />
<RadioButton
android:id="@+id/radio_button2"
android:layout_marginTop="2.0dip"
android:text="@string/main_manage_date"
android:drawableTop="@drawable/icon_3_n"
style="@style/main_tab_bottom" />
<RadioButton
android:id="@+id/radio_button3"
android:layout_marginTop="2.0dip"
android:text="@string/main_friends"
android:drawableTop="@drawable/icon_4_n"
style="@style/main_tab_bottom" />
<RadioButton
android:id="@+id/radio_button4"
android:layout_marginTop="2.0dip"
android:text="@string/more"
android:drawableTop="@drawable/icon_5_n"
style="@style/main_tab_bottom" />
RadioGroup>
LinearLayout>
TabHost>
修改 MainActivity.cs
2 using Android.App;
3 using Android.Content;
4 using Android.Runtime;
5 using Android.Views;
6 using Android.Widget;
7 using Android.OS;
8
9 namespace MyAppTest
10 {
11 [Activity(Label = "MyAppTest", MainLauncher = true, Icon = "@drawable/icon",Theme = "@android:style/Theme.DeviceDefault.NoActionBar")]
12 public class MainTabActivity : TabActivity, CompoundButton.IOnCheckedChangeListener
13 {
14 private TabHost mTabHost;
15 private Intent mAIntent;
16 private Intent mBIntent;
17 private Intent mCIntent;
18 private Intent mDIntent;
19 private Intent mEIntent;
20
21 protected override void OnCreate(Bundle bundle)
22 {
23 base.OnCreate(bundle);
24 RequestWindowFeature(WindowFeatures.NoTitle);
25 // Set our view from the "main" layout resource
26 SetContentView(Resource.Layout.Maintabs);
27
28 this.mAIntent = new Intent(this, typeof (AActivity));
29 this.mBIntent = new Intent(this, typeof (BActivity));
30 this.mCIntent = new Intent(this, typeof (CActivity));
31 this.mDIntent = new Intent(this, typeof (DActivity));
32 this.mEIntent = new Intent(this, typeof (EActivity));
33
34 ((RadioButton)FindViewById(Resource.Id.radio_button0)).SetOnCheckedChangeListener(this);
35 ((RadioButton)FindViewById(Resource.Id.radio_button1)).SetOnCheckedChangeListener(this);
36 ((RadioButton)FindViewById(Resource.Id.radio_button2)).SetOnCheckedChangeListener(this);
37 ((RadioButton)FindViewById(Resource.Id.radio_button3)).SetOnCheckedChangeListener(this);
38 ((RadioButton)FindViewById(Resource.Id.radio_button4)).SetOnCheckedChangeListener(this);
39
40
41 SetupIntent();
42 }
43
44 public void OnCheckedChanged(CompoundButton buttonView, bool isChecked)
45 {
46 if (isChecked)
47 {
48 switch (buttonView.Id)
49 {
50 case Resource.Id.radio_button0:
51 this.mTabHost.SetCurrentTabByTag("A_TAB");
52 break;
53 case Resource.Id.radio_button1:
54 this.mTabHost.SetCurrentTabByTag("B_TAB");
55 break;
56 case Resource.Id.radio_button2:
57 this.mTabHost.SetCurrentTabByTag("C_TAB");
58 break;
59 case Resource.Id.radio_button3:
60 this.mTabHost.SetCurrentTabByTag("D_TAB");
61 break;
62 case Resource.Id.radio_button4:
63 this.mTabHost.SetCurrentTabByTag("MORE_TAB");
64 break;
65 }
66 }
67 }
68
69 private void SetupIntent()
70 {
71 this.mTabHost = this.TabHost;
72 TabHost localTabHost = this.mTabHost;
73
74 localTabHost.AddTab(BuildTabSpec("A_TAB", Resource.String.main_home,Resource.Drawable.icon_1_n, this.mAIntent));
75
76 localTabHost.AddTab(BuildTabSpec("B_TAB", Resource.String.main_news,
77 Resource.Drawable.icon_2_n, this.mBIntent));
78
79 localTabHost.AddTab(BuildTabSpec("C_TAB",
80 Resource.String.main_manage_date, Resource.Drawable.icon_3_n,
81 this.mCIntent));
82
83 localTabHost.AddTab(BuildTabSpec("D_TAB", Resource.String.main_friends,
84 Resource.Drawable.icon_4_n, this.mDIntent));
85
86 localTabHost.AddTab(BuildTabSpec("MORE_TAB", Resource.String.more,
87 Resource.Drawable.icon_5_n, this.mEIntent));
88
89 }
90
91 private TabHost.TabSpec BuildTabSpec(string tag, int resLabel, int resIcon, Intent content)
92 {
93 return this.mTabHost.NewTabSpec(tag).SetIndicator(GetString(resLabel),
94 Resources.GetDrawable(resIcon)).SetContent(content);
95 }
96 }
97 }
注意红色部分,与自动创建的不同.
创建其他 Activity.cs / AActivity BActivity CActivity DActivity EActivity
using System;
using Android.Content;
using Android.Runtime;
using Android.Views;
using Android.Widget;
using Android.OS;
namespace MyAppTest
{
[Activity(Label = "AActivity", Icon = "@drawable/icon", Theme = "@android:style/Theme.DeviceDefault.NoActionBar")]
public class AActivity : Activity
{
protected override void OnCreate(Bundle bundle)
{
base.OnCreate(bundle);
RequestWindowFeature(WindowFeatures.NoTitle);
TextView tv = new TextView(this);
tv.SetText("This is A Activity!", TextView.BufferType.Normal);
tv.Gravity = GravityFlags.Center;
SetContentView(tv);
}
}
}
涉及到的资源这里没有列出,请参考源码.
4.真机调试
代码写完了,该编译以下了, 看看是否有错, 编译顺利通过, 插上真机(我这里有个买车险送的 200块的 Android平板 准备扔了的,试了下很真可以调试程序),
要VS直接调试的话,需要VS是以管理员方式启动的, 查上设备后你会看到:
设备显示在调试的位置,直接F5就可以了. 什么?无图无真相?
运行效果:
5.打包
调试完了,该打包发布了是吧?
等等 打包(Export Android Package(.apk))怎么是灰色的?
别着急,大微软肯定不会忽悠你.
原来你需要把编译 模式选择为 Release,默认的Debug是不能打包的. 看这里. 看这里.
打包完成:
你问我卡不卡呀? 我这不到200块钱的白送的pad都可以流畅的跑.
结束了,该上码了:
本文源码下载:
https://files.cnblogs.com/files/crazybird/MyAppTest.zip