Android Uygulamalarında Toolbar yapısına geçiş
Temel olarak, Toolbar‘ ı ActionBar‘ ın büyümüş, gelişmiş ve evin içerisinde biraz daha özgür ve rahatça dolaşabilen bir kardeşi olarak tanımlasak sanırım yanlış olmaz. Toolbar kullanıcı arayüzünün herhangi bir yerinde kullanılabilir, hatta doğrudan ActionBar’ ın görevlerini de yerine getirecek şekilde de kullanılabilir. Toolbar yapısal olarak son derece özelleştirilebilir bir duruma sahiptir.
Toolbar nasıl tanımlanır?
Toolbar’ ın tanımlaması son derece basittir. Diğer herhangi bir view nasıl tanımlanıyorsa, uygulamalarımızda kullanmak isteyeceğimiz toolbar yapısının tanımlanması da aynı şekilde olacaktır. Ancak burada verebileceğim tavsiye, toolbar’ ı ayrı bir layout dosyası içerisinde tanımlamanız ve diğer layout yapıları içerisinde include etmeniz şeklinde olacaktır. Örnek bir toolbar tanımlanmasını aşağıda paylaşıyorum.
|
1
2
3
4
5
6
|
<android.support.v7.widget.Toolbar
xmlns:android=“http://schemas.android.com/apk/res/android”
android:id=“@+id/toolbar”
android:layout_width=“match_parent”
android:layout_height=“wrap_content”
android:background=“?attr/colorPrimaryDark”/>
|
Genel olarak bakıldığında toolbar ile çalışma yöntemimizde bir farklılık olmayacak. Eğer Toolbar’ ın Activity içerisinde ActionBar olarak kullanılmasını istiyorsak yapmamız gereken tek şey bunu Activity’ e söylemek olacaktır. Bunun yolu ise;
|
1
2
3
4
|
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
if (toolbar != null) {
setSupportActionBar(toolbar);
}
|
İşte Toolbar’ ın Activity içerisinde ActionBar olarak kullanılmasını istiyorsanız yapmanız eklemeniz gereken kod satırı sadece bu. Bundan sonra artık menü, title ve diğer pek çok Actionbar özelliklerini Toolbar ile birlikte kullanabilirsiniz.
Artık Android uygulamalarını geliştirirken ActionBar kullanmamıza gerek yok. Ancak hemen panik yapmanıza da gerek yok. Bileceğiniz üzere Toolbar kendi API’ sinin sağladığı avantajlarla daha kullanışlı arayüz bileşenlerine sahip.
Şimdi sizlere Actionbar içeren bir uygulamanın nasıl güncellenerek Toolbar yapısına geçireceğiz onu göstermeye çalışacağım.
İlk olarak yapmanız gereken şey layout dosyanız da güncelleme yapmak olacaktır.
|
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
|
<?xml version=“1.0” encoding=“utf-8”?>
<android.support.v4.widget.DrawerLayout xmlns:android=“http://schemas.android.com/apk/res/android”
xmlns:app=“http://schemas.android.com/apk/res-auto”
android:id=“@+id/drawer”
android:fitsSystemWindows=“true”
android:layout_width=“match_parent”
android:layout_height=“match_parent”>
<LinearLayout
android:layout_width=“match_parent”
android:layout_height=“match_parent”
android:background=“@color/bg_color”
android:orientation=“vertical”>
<!— TOOLBAR —>
<include
android:id=“@+id/toolbar_actionbar”
layout=“@layout/toolbar”
android:layout_width=“match_parent”
android:layout_height=“wrap_content”/>
<FrameLayout
android:id=“@+id/container”
android:layout_width=“match_parent”
android:layout_height=“match_parent”
android:fitsSystemWindows=“true”
android:layout_below=“@+id/toolbar_actionbar” />
</LinearLayout>
<fragment
android:id=“@+id/fragment_drawer”
android:fitsSystemWindows=“true”
android:name=“org.ui.fragments.FrNavigationDrawer”
android:layout_width=“@dimen/drawer_width”
android:layout_height=“match_parent”
android:layout_gravity=“start”
app:layout=“@layout/fr_navigation_drawer” />
</android.support.v4.widget.DrawerLayout>
|
Toolbar için kullanmış olduğumuz layout’ u burada </include> tag’i kullanarak layout dosyamıza ekliyoruz. Burada içerik tamamen sizin geliştireceğiniz uygulamaya yönelik olacaktır.
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
<?xml version=“1.0” encoding=“utf-8”?>
<android.support.v7.widget.Toolbar
style=“@style/toolbar_style”
xmlns:android=“http://schemas.android.com/apk/res/android”
xmlns:app=“http://schemas.android.com/apk/res-auto”
android:layout_width=“match_parent”
android:layout_height=“?actionBarSize”
android:background=“@color/actionbar_color”>
<com.metalab.flow.viewanimations.CircleProgressView
android:id=“@+id/progress_spinner”
android:layout_width=“22dp”
android:layout_height=“22dp”
android:layout_gravity=“right”
android:visibility=“gone”
app:cpvStrokeWidth=“2dp”
app:cpvColor=“@android:color/white” />
</android.support.v7.widget.Toolbar
|
Buraya kadar yaptıklarımızı kısaca açıklayacak olursak,
ana içerik olarak belirlediğimiz framelayout‘ ın üst tarafına gelecek şekilde bir Toolbar yerleştirdik. Toolbar için ayrıca ana layout dosyamızdan bağımsız olarak ayrı bir dosya kullandık.
Style dosyamızın tanımlanması
Bu noktada Android uygulamalarınızda önceki sürümlerle uyumluluk sağlamak adına ana kütüphane olarak AppCompat kullanmanız tavsiye edilmektedir. R.I.P. ActionBarSherlock
Eklemiş olduğunuz Toolbar’ ın uygulama tarafından sadece tek başına Actionbar olarak tanınmasını istiyorsanız, uygulamanız için tanımlamış olduğunuz tema için gösterilen parent tema Theme.AppCompat.Light.NoActionBar olmalıdır. Eğer tanımlamış olduğunuz tema kendisine parent olarak otomatik olarak ActionBar oluşturulan bir tema’yı kabul ederse, Theme.AppCompat.Light.DarkActionBar, ikinci bir Toolbar eklenmesini engellemek amacıyla <item name=”windowActionBar”>false</item> tanımlanmalıdır.
|
1
2
3
4
5
6
7
8
|
<style name=”toolbar_style” parent=””>
<item name=”popupTheme”>@style/toolbar_popup_style</item>
<item name=”theme”>@style/ThemeOverlay.AppCompat.Dark.ActionBar</item>
</style>
<style name=”toolbar_popup_style” parent=”Theme.AppCompat”>
<item name=”colorAccent”>@color/accent</item>
</style>
|
Activity sınıfının tanımlaması
Activity sınıfınız ActionBarActivity extend etmelidir.
|
1
|
setSupportActionBar(mToolbar);
|
tanımlamış olduğunuz Toolbar‘ ın ActionBar olarak kabul görmesi amacıyla bu kod satırını kullanmalısınız.
|
1
|
mToolbar.setNavigationIcon(R.drawable.ic_menu_white_24dp);
|
sol tarafta kullanılacak hamburger icon’ u için bu kod satırını kullanmalısınız.
