Android Dersleri 9 : Action Bar Kullanımı




Bir önceki dersimizde listView'deki elemanların Costum Dialog ile nasıl güncellendiğinden bahsetmiştik(.Bu yazımı daha iyi anlayabilmeniz için bir önceki yazıma mutlaka bakmanızda fayda var.isteyenler burdan bakabilir).Bu dersimizde ise listemize yeni eleman eklemeyi göreceğiz. Bunu Action Bar üzerinden yapacağız. Aşağıdaki gibi ;
Gördüğünüz gibi Action Bar üzerinde bir kaç değişiklik yaptık; -icon ekledik -ismini özelleştirdik -bir tane de "+" icon resmi bir item ekledik(sağ tarafta). Listeye elaman ekleme işlemini bu buton üzerinden yapacağız . Bu butona tıkladığımızda, karşımızda yukarıdaki gibi Dialog ekranı belirecek. Tasarımı oldukça basit tutmaya çalışıyorum. Ben icon olarak 2 tane "+" kullandım isteyenler daha farklı resim ve de tasarım  kullanabilir. Nasıl değiştirebileceğinizi birazdan göstereceğim. Öncelikle ekle_dialog.xml adında bir tane layout oluşturup içinin aşağıdaki gibi olmasını sağlayalım.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/background_dark"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@android:color/background_dark" >
<ImageView
android:id="@+id/imageView1"
android:layout_width="50dp"
android:layout_height="50dp"
android:src="@drawable/new_content"
/>
<ImageView
android:id="@+id/imageView2"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_weight="1"
android:src="@drawable/new_content" />
</LinearLayout>
<EditText
android:id="@+id/editText1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ems="10"
android:textColor="@android:color/white" >
<requestFocus />
</EditText>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textColor="@android:color/white"
android:text="ekle" />
<Button
android:id="@+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="iptal"
android:textColor="@android:color/white"
android:layout_weight="1" />
</LinearLayout>
</LinearLayout>
Dialog erkanının üstündeki iconları ImageView görselinin içindeki android:src="@drawable/new_content" kodu ile ekliyoruz. Burda yaptığımız olay Drawable klasörünün altındaki, daha önce kaydettiğimiz new_content isimli icona ulaşmaktan ibaret. Tasarımımızı yaptıktan sonra, artık java koduna geçebiliriz. Öncelikle, aşağıdaki gibi bir ActionBar tanımı yapalım(OnCreate() methodumuzun içine yazalım) ;
1
2
3
4
5
actionBar = getActionBar();
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_LIST);
actionBar.setDisplayShowHomeEnabled(true);
actionBar.setTitle("action bar");
actionBar.setIcon(R.drawable.giris_logo);
 
1
private ActionBar actionBar;
bu actionBar nesnesini OnCreate() methodunun üstüne yazalım. Aksi takdirde program hata verecektir. Burda yaptığımız olay, actionBarı atkif etmek için gerekli kodları yazmaktan başka bişey değil. Üzerinden hızlıca geçelim; getActionBar(); methodu ile actionBar nesnesini çağırıyoruz. setNavigationMode(); methodu ile Action Bar'ın liste modunda çalışacağını belirtiyoruz. setDisplayShowHomeEnable(); methodu ise, icona tıkladığımızda anasayfaya gitmemizi sağlayan işlevin kullanılabilir olmasını sağlıyor. Bu uygulamamızda başka activity olmadığı için, şuan bize lazım değil. setTitle(); ile başlığımızı, setIcon(); ile de iconumuzu belirliyoruz. (icon, drawable klasörü altında, daha önce kaydettiğimiz giris_logo isimli resmimizdir.) Bir önceki dersimizde Liste elemanlarını values klasörü altındaki string.xml dosyası altında tanımlamıştık. Şimdi ise bu tanımı javanın içine alıyoruz aşağıdaki gibi;
1
2
3
4
5
6
7
8
9
10
private List<String> getListe(){
List<String> lists = new ArrayList<String>();
lists.add("İstanbul");
lists.add("Ankara");
lists.add("İzmir");
lists.add("Bartın");
lists.add("Eskişehir");
lists.add("Bursa");
return lists;
}
      Önceki derslerimizde liste elemanlarına ulaşmak için ;
1
liste = getResources().getStringArray(R.array.liste);
kodunu kullanmıştık ve liste değişkeninin tanımını private String[ ] liste; şeklinde yapmıştık. Şimdi bunları değiştirip, değişken tanımımızı private List<String> liste; şeklinde yapıp, yukarıda oluşturduğumuz getListe()  methodunu, bu değişkene atayalım. aşağıdaki gibi;
1
liste = getListe();
 Liste elemanları üzerinde değişlik yapmak istediğimizde, bunu getListe() methodu üzerinden çok rahat bir şekilde yapabiliriz. Şimdi Action Bar üzerindeki Menu item'i oluşturmaya geldi sıra. Bunun için main.xml dosyasına aşağıdaki item'i ekleyelim:
1
2
3
4
<item
android:id="@+id/ekle"
android:icon="@drawable/new_content"
android:showAsAction="ifRoom"/>
Burda yaptığımız olay oldukça basit, ilk önce id'mizi belirledik, sonra drawable klasörü altına kaydettiğimiz iconumuzu seçtik. showAsAction'u kullanmamızdaki amaç, eğer itemler, ActionBar'a sığmayacak kadar çok ise gösterilebilecekleri gösterip, diğerlerini overFlow menu içinde listelenmesini sağlamaktır. menu.xml içinde oluşturduğumuz item'e java içinden ulaşalım. Bunun için OnCreateOptionsMenu()methodunu Override etmemiz gerekmektedir. Eclipse kullananlar için Source-Override/Implement Methods yordamını izleyip ordan bu methodu eklemeleri yeterlidir.
1
2
3
4
5
6
@Override
public boolean onCreateOptionsMenu(Menu menu) {
MenuInflater inflater = getMenuInflater();
inflater.inflate(R.menu.main, menu);
return super.onCreateOptionsMenu(menu);
}
Bu method ile menu.xml içinde oluşturduğumuz bütün itemleri ActionBar üzerine ekleyebiliriz. Daha sonra tıklanan item'lerin değerlendirmesini yapmak için (yani hangi iteme tıklanıldığını ve tıkladığımızda ne olmasını istiyorsak, bunların kontrol edildiği methodu )onOptionsItemSelected() methodunu aynı şekilde Override edelim.
1
2
3
4
5
6
7
8
9
10
@Override
public boolean onOptionsItemSelected(MenuItem item) {
switch (item.getItemId()) {
case R.id.ekle:
AlertEkle();
}
return super.onOptionsItemSelected(item);
}
Burdaki olayımız da şudur ; menu.xml dosyasının içine eklediğimiz item'in id'sini "ekle" olarak belirlemiştik. switch/case kontrol yapısıyla bu itemin tıklanabiliriliği kontrol ediyoruz. Yani tıkladığımız zaman AlertEkle() adındaki methodumuzun çalışmasını sağlıyoruz. Bu methodun içine de Dialog ekranımızın oluşmasını sağladık.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
private void AlertEkle(){
LayoutInflater inflater = LayoutInflater.from(this);
View layout = inflater.inflate(R.layout.ekle_dialog, null);
final Button ekleBtnn = (Button) layout.findViewById(R.id.button1);
final Button iptalBtnn= (Button) layout.findViewById(R.id.button2);
final EditText ekleEdt=(EditText) layout.findViewById(R.id.editText1);
final AlertDialog.Builder built = new AlertDialog.Builder(this);
built.setView(layout);
final AlertDialog dialog1 = built.create();
dialog1.show();
iptalBtnn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
dialog1.cancel();
}
});
ekleBtnn.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
liste.add(ekleEdt.getText().toString());
adapter.notifyDataSetChanged();
dialog1.dismiss();
Toast.makeText(getApplicationContext(), ekleEdt.getText().toString()+" eklendi.", Toast.LENGTH_SHORT).show();
}
});
}
Burda yaptığımızın bir önceki dersimizde yaptığımızdan pek bir farkı yok. Sadece 27. satırdaki ekleme işleminden bahsetmek istiyorum. liste.add() komutu ile listemize eklemek istediğimiz kelimeyi ekleyebiliriz. Kelime olarakta Edittext'e girdiğimiz kelimeye ekleEdt.gettext().toString() kod parçası ile ulaşıyoruz. ekleEdt nesnesi, yukarıda tanımladığımız Edittext'in javadaki değeridir. Artık programımızı çalıştırabilirsiniz. ActionBar üzerindeki item'e tıkladığınızda yukarıdaki gibi bir Dialog penceresinin açıldığını göreceksiniz. Daha sonra kelimeyi yazıp ekle butonuna tıkladığınızda kelimeyi listenin sonunda görebilirsiniz.   Kaynak http://muminbasol.blogspot.com.tr/2014/01/android-dersleri-3-action-bar-kullanm.html
Google Plus ile Paylaş

Kısaca: seymanblog

Panelde şablon düzenle deyip, bu satırı aratarak buraya kısaca hakkımda yazısı yazabilirsiniz.
    BLOGGER YORUMLARI
    FACEBOOK YORUMLARI

0 yorum:

Yorum Gönder