Xamarin.Android之简单的抽屉布局

0x01 前言

相信对于用过Android版QQ的，应该都不会陌生它那个向右滑动的菜单(虽说我用的是Lumia)

今天就用Xamarin.Android实现个比较简单的抽屉布局。下面直接进正题。

0x02 做个简单的抽屉布局

新建个android项目

通过NuGet安装个Xamarin.Android.Support.v4

其实呢，官网那里还用很多组件可用拿来尝试一下的。

https://components.xamarin.com/

然后修改Main.axml

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:layout_width="match_parent"
 4     android:layout_height="match_parent">
 5     <android.support.v4.widget.DrawerLayout
 6         android:id="@+id/mDrawerLayout"
 7         android:layout_width="match_parent"
 8         android:layout_height="match_parent">
 9         <FrameLayout
10             android:id="@+id/content_frame"
11             android:layout_width="match_parent"
12             android:layout_height="match_parent" />
13         <ListView
14             android:id="@+id/left_drawer"
15             android:layout_width="200dp"
16             android:layout_height="match_parent"
17             android:layout_gravity="start"
18             android:background="@android:color/holo_blue_light"
19             android:choiceMode="singleChoice"
20             android:divider="@android:color/transparent"
21             android:dividerHeight="0dp" />
22     </android.support.v4.widget.DrawerLayout>
23 </RelativeLayout>

这里用了相对布局，更重要的是android.support.v4.widget.DrawerLayout

同时新建一个fragmentcontent.axml，用于呈现选中菜单的内容。

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:orientation="vertical"
 4     android:layout_width="match_parent"
 5     android:layout_height="match_parent">
 6     <TextView
 7         android:layout_width="match_parent"
 8         android:layout_height="match_parent"
 9         android:gravity="center"
10         android:textAlignment="center"
11         android:textSize="30dp"
12         android:id="@+id/txtName" />
13 </LinearLayout>

内容比较简单，就是显示相应菜单的文本。

然后，修改MainActivity

 1 using Android.App;
 2 using Android.OS;
 3 using Android.Support.V4.Widget;
 4 using Android.Widget;
 5 namespace DrawerLayoutDemo
 6 {
 7     [Activity(Label = "DrawerLayoutDemo", MainLauncher = true, Icon = "@drawable/icon")]
 8     public class MainActivity : Activity
 9     {
10         private string[] _menu;
11         protected override void OnCreate(Bundle bundle)
12         {
13             base.OnCreate(bundle);
14             
15             SetContentView(Resource.Layout.Main);
16             //the menu
17             _menu = new string[] { "C#", "Python", "Xamarin" };
18             //listview
19             var listView = FindViewById<ListView>(Resource.Id.left_drawer);
20             //adapter
21             listView.Adapter = new ArrayAdapter<string>(this, Android.Resource.Layout.SimpleListItem1, _menu);
22             //drawerlayout
23             var drawerLayout = FindViewById<DrawerLayout>(Resource.Id.mDrawerLayout);
24             //click event
25             listView.ItemClick += ItemClick;
26         }
27         /// <summary>
28         /// item click event of the listview 
29         /// </summary>
30         /// <param name="sender"></param>
31         /// <param name="e"></param>
32         private void ItemClick(object sender, AdapterView.ItemClickEventArgs e)
33         {  
34             //fragment
35             Fragment fragment = new FragmentContent(_menu[e.Position]);
36             //show
37             var fm = FragmentManager.BeginTransaction().Replace(Resource.Id.content_frame, fragment).Commit();
38         }
39     }
40 }

MainActivity的话主要是处理ListView的绑定以及点击事件。

新建一个FragmentContent

 1 using Android.App;
 2 using Android.OS;
 3 using Android.Views;
 4 using Android.Widget;
 5 namespace DrawerLayoutDemo
 6 {
 7     public class FragmentContent : Fragment
 8     {
 9         private string _text;
10         public FragmentContent(string text)
11         {            
12             _text = text;
13         }
14         public override void OnCreate(Bundle savedInstanceState)
15         {
16             base.OnCreate(savedInstanceState);            
17         }
18                 
19         public override View OnCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState)
20         {
21             //get the view
22             View view = inflater.Inflate(Resource.Layout.fragmentcontent, null);            
23             var txt = view.FindViewById<TextView>(Resource.Id.txtName);
24             //set the text of the textview
25             txt.Text = "I Love " + _text;
26             return view;
27         }
28     }
29 }

Fragment的话，就是显示把fragmentcontent.axml显示，把菜单的值显示出来。

到这里，功能是已经完成了，但是呢，是不是就能成功运行呢？

问题还是有的！！发布的时候，出现下面的问题。

1>C:\Program Files (x86)\MSBuild\Xamarin\Android\Xamarin.Android.Common.targets(348,2): error XA5208: Download failed. Please download https://dl-ssl.google.com/android/repository/android_m2repository_r29.zip and put it to the C:\Users\Catcher\AppData\Local\Xamarin\Android.Support.v4\23.3.0.0 directory.

1>C:\Program Files (x86)\MSBuild\Xamarin\Android\Xamarin.Android.Common.targets(348,2): error XA5208: Reason: One or more errors occurred.

1>C:\Program Files (x86)\MSBuild\Xamarin\Android\Xamarin.Android.Common.targets(348,2): error XA5207: Please install package: 'Xamarin.Android.Support.v4' available in SDK installer. Java library file C:\Users\Catcher\AppData\Local\Xamarin\Android.Support.v4\23.3.0.0\embedded\classes.jar doesn't exist.

1>C:\Program Files (x86)\MSBuild\Xamarin\Android\Xamarin.Android.Common.targets(348,2): error XA5208: Reason: One or more errors occurred.

下面给出解决方案。