Navigation Tiroir avec onglet dans la page principale android xamarin

Question

Je fais une application avec le tiroir de navigation. Je veux ajouter un onglet dans la page principale, mais quand je lance l'application, j'ai une erreur dans

System.NullReferenceException: référence d'objet non définie à une instance d'un objet.

ActionBar.NavigationMode = ActionBarNavigationMode.Tabs; 

comment ajouter onglet? mon code est:

namespace NavigationDrawerLayout 
{ 
    [Activity(Label = "NavigationDrawerLayout", Theme = "@style/Theme.DesignDemo", MainLauncher = true, Icon = "@drawable/icon")] 
    public class MainActivity : AppCompatActivity 
    { 

     DrawerLayout drawerLayout; 
     NavigationView navigationView; 
     protected override void OnCreate(Bundle bundle) 
     { 
      base.OnCreate(bundle); 

      // Set our view from the "main" layout resource 
      SetContentView(Resource.Layout.Main); 
      ActionBar.NavigationMode = ActionBarNavigationMode.Tabs; 


      // Add the tabs to Action Bar 
      AddTab("Tab One"); 
      AddTab("Tab Two"); 
      AddTab("Tab Three"); 
      drawerLayout = FindViewById<DrawerLayout>(Resource.Id.drawer_layout); 


      // Create ActionBarDrawerToggle button and add it to the toolbar 
      var toolbar = FindViewById<V7Toolbar>(Resource.Id.toolbar); 
      SetSupportActionBar(toolbar); 


      var drawerToggle = new ActionBarDrawerToggle(this, drawerLayout, toolbar, Resource.String.drawer_open, Resource.String.drawer_close); 
      drawerLayout.SetDrawerListener(drawerToggle); 
      drawerToggle.SyncState(); 

      navigationView = FindViewById<NavigationView>(Resource.Id.nav_view); 
      setupDrawerContent(navigationView); 



     } 
     private void AddTab(string tabText) 
     { 
      Android.App.ActionBar.Tab tab = ActionBar.NewTab(); 
      tab.SetText(tabText); 
      tab.TabSelected += OnTabSelected; 
      ActionBar.AddTab(tab); 
     } 
     private void OnTabSelected(object sender, Android.App.ActionBar.TabEventArgs args) 
     { 
      var CurrentTab = (Android.App.ActionBar.Tab)sender; 

      if (CurrentTab.Position == 0) 
      { 

      } 

      else 
      { 

      } 
     } 
     void setupDrawerContent(NavigationView navigationView) 
     { 
      navigationView.NavigationItemSelected += (sender, e) => { 
       e.MenuItem.SetChecked(true); 
       drawerLayout.CloseDrawers(); 
      }; 
     } 

     public override bool OnCreateOptionsMenu(IMenu menu) 
     { 

      navigationView.InflateMenu(Resource.Menu.nav_menu); 
      return true; 

     } 

     } 
} 

main.axml

<?xml version="1.0" encoding="utf-8"?> 
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:orientation="vertical" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent"> 
    <android.support.v4.widget.DrawerLayout xmlns:app="http://schemas.android.com/apk/res-auto" 
     android:id="@+id/drawer_layout" 
     android:layout_height="match_parent" 
     android:layout_width="fill_parent" 
     android:fitsSystemWindows="true"> 
     <LinearLayout 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:orientation="vertical"> 
      <include 
       layout="@layout/toolbar" /> 
     </LinearLayout> 
     <android.support.design.widget.NavigationView 
      android:id="@+id/nav_view" 
      android:layout_height="match_parent" 
      android:layout_width="300dp" 
      android:layout_gravity="start" 
      android:fitsSystemWindows="true" 
      app:headerLayout="@layout/nav_header" /> 
    </android.support.v4.widget.DrawerLayout> 
</LinearLayout> 

styles.xml

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

    <style name="Theme.DesignDemo" parent="Base.Theme.DesignDemo"> 
    </style> 

    <style name="Base.Theme.DesignDemo" parent="Theme.AppCompat.Light.NoActionBar"> 
    <item name="colorPrimary">@color/ColorPrimary</item> 
    <item name="colorPrimaryDark">@color/ColorPrimaryDark</item> 
    </style> 


</resources> 

Answer 1

System.NullReferenceException: référence d'objet non définie à une instance d'un objet.

Lorsque vous souhaitez ajouter un onglet ActionBar, votre Activity devrait avoir ActionBar d'abord, mais dans votre Theme.DesignDemo, vous avez le supprimer dans votre Activity:

<style name="Base.Theme.DesignDemo" parent="Theme.AppCompat.Light.NoActionBar"> 

Cela signifie que vous ne pouvez pas obtenir la ActionBar dans votre Activity, et vous avez utilisé Toolbar à la place. C'est pourquoi il lance NullReferenceException exception.

comment ajouter un onglet?

Avec l'API 21, la méthode ActionBarNavigationMode.Tabs est deprecated. Vous pouvez utiliser TabLayout dans la bibliothèque de support de conception .

Son utilisation est très simple, vous pouvez l'ajouter dans votre toolbar.axml comme ceci:

Toolbar.axml:

<?xml version="1.0" encoding="utf-8"?> 
<android.support.design.widget.CoordinatorLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    ... 
    > 
    <android.support.design.widget.AppBarLayout 
     ... 
     android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> 

    <android.support.v7.widget.Toolbar 
     android:id="@+id/toolbar" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:elevation="4dp" 
     android:background="@color/colorPrimary" /> 

    <android.support.design.widget.TabLayout 
     android:id="@+id/tablayout" 
     android:layout_height="wrap_content" 
     android:layout_width="match_parent"> 
     <android.support.design.widget.TabItem 
      android:text="Tab One"/> 
     <android.support.design.widget.TabItem 
      android:text="Tab Two"/> 
     <android.support.design.widget.TabItem 
      android:text="Tab Three"/> 
    </android.support.design.widget.TabLayout> 

</android.support.design.widget.AppBarLayout> 
</android.support.design.widget.CoordinatorLayout> 

utiliser dans votre code:

TabLayout tabLayout = FindViewById<TabLayout>(Resource.Id.tablayout); 
tabLayout.SetupWithViewPager(viewPager); 
//The one-stop shop for setting up this TabLayout with a ViewPager 

Voici son effect . Pour plus d'informations, vous pouvez lire ceci document.