Xamarin iOS – Using UITabBarController

Xamarin iOS – Using UITabBarController

UITabBarController dapat digunakan untuk menyajikan beberapa controller dalam satu screen pada iOS. Bagaimana cara menggunakan UITabBarController pada iOS? dan bagaimana melempar suatu parameter ke seluruh tab yang ada?

Anda dapat menambahkan UITabBarController langsung pada file storyboard. Pilih control UITabBarController dan drag-drop pada storyboard (tambahkan segue agar terhubung dengan aplikasi yang telah dibuat sebelumnya).

screen-shot-2016-11-09-at-12-45-50-pm

Pada contoh di atas kita menghubungkan segue dari UITableCellView ke UITabBarController. Agar dapat membedakan antara UIViewController pada tab1 dan tab2, tambahkan sebuah label pada masing-masing UIViewController.

Tambahkan code berikut pada class “SimpleSource.cs” (lihat postingan Xamarin iOS sebelumnya/lihat pada code github) untuk memberikan sebuah perlakuan ketika pengguna melakukan click pada data :

 public override void RowSelected(UITableView tableView, NSIndexPath indexPath)
 {
     _controller.PerformSegue("TabBar", _controller);
 }

Dan tambahkan code berikut pada constructor-nya :

 //definition WelcomeController to get parent controller
 WelcomeController _controller;
 public SimpleSource(WelcomeController _controller, List<Player> datas)
 {
     this.datas = datas;
     this._controller = _controller;
 }

Jalankan aplikasi dan akan muncul tampilan seperti berikut :

uitabbar

Bagaimana cara melempar parameter di semua tab kemudian melakukan refresh pada semua tab tersebut? Mari tambahkan sebuah UIBarButtonItem pada TabController kita, dengan menambahkan code berikut pada class “TabController.cs” :

 public override void ViewDidLoad()
 {
     base.ViewDidLoad();
     this.InitializeBar();
 }

 private void InitializeBar()
 {
     UIBarButtonItem t1 = new UIBarButtonItem(
        UIBarButtonSystemItem.Add
        (s, e) =>
        {//this space will use for run procces when click
        }
     );

     NavigationItem.RightBarButtonItem = t1;
 }

Buatlah sebuah interface bernama “TabInterface.cs” yang akan di-extend oleh UIViewController pada setiap class pada Tab Bar, masukkan code berikut :

using System.Collections.Generic;

namespace ios_playground
{
   public interface TabInterface
   {
       void ReloadScreen(int click);
   }
}

Pada Tab1Controller.cs dan Tab2Controller.cs extend class “TabInterface” dan buat sebuah fungsi void ReloadScreen :

 public partial class Tab1Controller : UIViewController, TabInterface
 {
        string label_text = "Tab1";
        public Tab1Controller (IntPtr handle) : base (handle)

        {

        }

        public override void ViewWillAppear(bool animated)
        {
            base.ViewWillAppear(animated);
            this.Lbl_item.Text = label_text;
        }

        public void ReloadScreen(int click)
        {
            label_text = "Tab1 : You tab me " + click.ToString() + " time(s)";
            if (this.Lbl_item != null)
                this.Lbl_item.Text = label_text;
        }
    }

Tab2Controller.cs :

 public partial class Tab2Controller : UIViewController, TabInterface
 {
        string label_text = "Tab2";
        public Tab2Controller (IntPtr handle) : base (handle)
        {
        }

        public override void ViewWillAppear(bool animated)
        {
            base.ViewWillAppear(animated);
            this.Lbl_Item.Text = label_text;
        }

        public void ReloadScreen(int click)
        {
            this.label_text = "Tab 2 : You tab me " + click.ToString() + " time(s)";
            if (this.Lbl_Item != null)
                this.Lbl_Item.Text = label_text;
        }
    } 

Sekarang kembali pada TabController.cs, masukkan code berikut pada UIBarButtonItem yang telah dibuat sebelumnya :

 public override void ViewDidLoad()
 {
     base.ViewDidLoad();
     this.InitializeBar();
 }

 private int click_count = 0;
 private void InitializeBar()
 {
     UIBarButtonItem t1 = new UIBarButtonItem(
         UIBarButtonSystemItem.Add
         (s, e) =>
         {
             ++click_count;
             foreach (UIViewController temp in this.ViewControllers)
             {
                TabInterface pi = (TabInterface)temp;
                pi.ReloadScreen(click_count);
             }
         }
    );

    NavigationItem.RightBarButtonItem = t1;
 }

Berikut adalah tampilan aplikasi setelah dijalankan :

uitabbar2

Pada video tersebut kedua bar akan merefresh nilai label setiap kali di klik pada bar button “+” pada bagian atas..

Happy coding..

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: