Menampilkan Context Menu dengan Hold

Dari pengalaman saya biasanya jika ingin menampilkan menu cukup menampilkan menu di bagian atas aplikasi untuk aplikasi berbasis Dekstop. Tetapi jika berbasis mobile? Yah seperti yang kita ketahui layar mobile cukup sempit jadi kita harus bisa memanfaatkan sebaik mungkin layar mobile kita. Pada awalnya saya berpikir untuk membuat aplikasi yang memiliki sebuah database dimana ada fitur menampilkan data dan jika data tersebut di hold maka akan muncuk menu pilihan mau menghapus atau mau meng-update?. Saya binggung ini fitur apa ya namanya? Setelah saya cari akhirnya dapat juga dan ternyata namanya adalah Context Menu.

Bagaimana membuatnya? Tahapannya cukup gampang, pertama silahkan instal Windows phone Toolkit terlebih dahulu pada project anda. Caranya cukup pilih Tools –> NuGet Package Manager–>Manage Packages for Solution maka akan muncul tampilan seperti dibawah ini.

Setelah Instal, yang perlu anda lakukan selanjutnya adalah meng-copy kode di bawah ini di halaman MainPage.xaml bagian atas.

 xmlns:toolkit="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls.Toolkit"

Kemudian, copy kode di bawah ini detelah deklarasi Tools yang ingin anda tambahkan tetapi deklrasinya belum ditutup misal pada pendekralasian Button maka kode di bawah ini berada sebelum </Button>.

<toolkit:ContextMenuService.ContextMenu>
                    <toolkit:ContextMenu IsZoomEnabled="True" x:Name="ContextMenu" >
                        <toolkit:MenuItem Header="Add"  />
                        <toolkit:MenuItem Header="Update" />
                        <toolkit:MenuItem Header="Delete" />
                    </toolkit:ContextMenu>
</toolkit:ContextMenuService.ContextMenu>

Selesai.. jika program anda jalankan dan anda hold pada tools yang anda tambahkan Menu Item maka nanti akan muncul menu Item yang sudah kita buat yaitu Add, Update dan Delete seperti gambar di bawah ini. Ini bisa anda ubah dengan menambah menu baru atau mengubah menu yang ada atau bisa juga mengurangi menu sesuai kebutuhan anda.

Dan jika anda ingin menambahkan event untuk setiap Menu Itemnya silahkan modifikasi pada tahapan ke 3 dengan menambahkan Click=”Nama_Method” atau jika mau lebih jelas silahkan perhatiakn code di bawah ini.

<toolkit:ContextMenuService.ContextMenu>
                    <toolkit:ContextMenu IsZoomEnabled="True" x:Name="ContextMenu" >
                        <toolkit:MenuItem Header="Add" Click="Opstion_Click" />
                        <toolkit:MenuItem Header="Update" Click="Opstion_Click"/>
                        <toolkit:MenuItem Header="Delete" Click="Opstion_Click"/>
                    </toolkit:ContextMenu>
</toolkit:ContextMenuService.ContextMenu>

Sekarang tinggal menambahkan method event-nya pada mainpage.xaml.cs

private void Opstion_Click(object sender, RoutedEventArgs e){
            MenuItem menuItem = (MenuItem)sender;
            MessageBox.Show(menuItem.Header.ToString());
}

Selamat Mencoba.. 🙂

 

 

 

[Xamarin – Android] How To Use Dialog (2)

From post : https://sabitlabscode.wordpress.com/2014/03/30/xamarin-android-how-to-use-dialog-1/ , we will learn how to make a dialog with multi choice item. Multi choice means we can choose more than one item from the list.  It will show as checkbox, not radio button. From previous project, call dialog with this code :

MultiChoiceItem Dialog

  protected override Dialog OnCreateDialog (int id)
 {
    switch (id) {
      case yourId:
      {
            string[] color_options = Resources.GetStringArray (Resource.Array.nameArray);
            
            bool[] check_list; // this use for make default check in list
            check_list = new bool[color_options.Length]; // it set the length of the list same with length options
            check_list [2] = true; // this is how we set the list,
            // you can set where list that you want to set with
            // set the index

          builder = new AlertDialog.Builder (this);
          builder.SetTitle ("Pick a color");
          builder.SetNegativeButton ("Cancel", CancelClicked);
          builder.SetPositiveButton ("OK", OkClicked);// make event ok separate in another event
          
          // it set the dialog with multi choice item, and if one of the item click/select
          // app will set check_list value
          builder.SetMultiChoiceItems (color_options, check_list, (o, e) => {
                check_list [e.Which] = e.IsChecked;
          });
          return builder.Create ();
       }
    }
    return null;
}

After that, we need to make “OkClicked” to run the event when user click “OK” button.

private void OkClicked (object sender, DialogClickEventArgs e)
{
    // insert your code here
    // you can get the value from check_list like "check_list[0]"
    ((Dialog)sender).Dismiss ();
}

Input Dialog

Input dialog is a dialog that you can input with a text not select an item. With input dilaog, get spesific value to process because it not only some options. To implement it, you just need to insert your code like this :

  protected override Dialog OnCreateDialog (int id)
 {
    switch (id) {
      case yourId:
      {
            EditText input = new EditText (this);            
            builder = new AlertDialog.Builder (this);
            builder.SetTitle ("Insert Value: ");
            builder.SetMessage ("Enter your text here");
            builder.SetView (input);
            builder.SetPositiveButton ("Ok", (o, e) => {
                // insert your code here
                ((Dialog)o).Dismiss ();
            });
            builder.SetNegativeButton ("Cancel", Cancelcancel);
            return builder.Create ();
      }
    }
    return null;
}

After insert that code, run your application and you will see input text on your dialog..

Finish… Hope it helps..

Happy coding…

[WP8 + SQLite] Delete Data From SQLite In Windows Phone

Sebelumnya saya pernah memposting menggenai SQLite juga tetapi baru tentang menginput data. Sekarang saya akan membahas bagaimana menghapus data dari SQLite. Project yang saya gunakan pada postingan ini adalah lanjutan dari postingan sebelumnya. Saya hanya melakukan penambahan fitur long press selected item pada listbox yang sudah pernah saya berikan.

Pada sadarnya untuk menghapus data di SQLite cukup gampang hanya membutuhkan SQL untuk mendeletenya saja. hanya saja sebelum membuat SQL kita perlu pendeklarasian SQL comment terlebih dahulu, carannya adalah dengan :

SQLiteCommand sqlComm = new SQLiteCommand(dbConn);

Setelah memiliki SQL comment sekarang anda bisa menyiapkan sintak SQL yang ingin dieksekusi dan disimpan dalam SQL comment, cara seperti di bawah ini:

 sqlComm.CommandText = "delete from task where nama = '" + Budi+ "'";

SQL diatas adalah untuk mendelete data yang dimiliki budi, ini bisa dimanipulasi dengan menganti kriterianya seperti SQL biasa. atau bisa disesuaikan dengan ini dari textbox seperti ini.

sqlComm.CommandText = "delete from task where nama = '" + textBox1.text+ "'";

Jika sudah siap SQLnya dan sudah disimpan dalam SQL comment sekarang saatnya untuk mengeksekusi SQL comment. Berikut caranya.

sqlComm.ExecuteQuery<Task>();

Penjelasan diatas adalah dasar dari cara menghapus data di SQLite, untuk implementasi penghapusannya mungkin banyak ide yang muncul dan berbeda-beda untuk setiap individu. Untuk implementasinya saya akan menambahkan fitur hapus jika ada item list yang di tekan lama (hold) maka akan ada konfirmasi penghapusan data. Cara menambahkan even hold cukup menambahkan even pada list seperti gambar di bawah ini.

Sedangkan di mainpage.xml.csnya saya tambahkan kode di bawah ini yang merupakan hasil modipikasi code sebelumnya yang kita bahas.

private string potong(int urutan, string isiList) {
            string temp =string.Empty;int i=0;
            foreach (var t in isiList.ToCharArray()) {
                if (i == urutan && !t.Equals(':')) 
                    temp += t;
                else if (t.Equals(':')) 
                    i++;
            }
            return temp;
        }
        private void DataList() {
            List<Task> retrievedTasks = dbConn.Table<Task>().ToList<Task>();
            DaftarTlp.Items.Clear();
            foreach (var t in retrievedTasks)
            {
                DaftarTlp.Items.Add(t);
            }
            TBTlp.Text = string.Empty;
            TBNama.Text = string.Empty;
        }
        private void DaftarTlp_Hold(object sender, System.Windows.Input.GestureEventArgs e)
        {
            if (DaftarTlp.SelectedIndex >=0)
            {
                MessageBoxResult result=MessageBox.Show("Delete","Are you sure ?",MessageBoxButton.OKCancel);
                if (result==MessageBoxResult.OK) {
                    Task task = new Task();
                    SQLiteCommand sqlComm = new SQLiteCommand(dbConn);
                    sqlComm.CommandText = "delete from task where nama = '" + potong(1,DaftarTlp.SelectedItem.ToString()) + "'";
                    sqlComm.ExecuteQuery<Task>();
                    DataList();
                }
            }
        }

Jika item list kita hold maka akan muncul message box yang berfungsi mengkonfirmasi apakah kita benar-benar mau menghapus data item yang kita pilih. Jika user memilih iya maka data akan terhapus. Kurang lebih itu ide dari saya, jika anda memiliki ide yang berbeda silahkan dimodifikasi sesuai kebutuhan anda tetapi pada dasarnya penghapusan itu sama.. Selamat mencoba.. 🙂