2 Ekim 2015 Cuma

#ANDROID - SlidingDrawer Kullanımı

  Hiç yorum yok
SlidingDrawer'ı bir resimle anlatmak daha doğru olacak. Yanda gördüğünüz gibi ekranımızın en altında, üstünde "sürükle" yazılı bir butonumuz var. O aslında sıradan bir buton değil SlidingDrawer butonu.

Bu butonu yukarı doğru parmağımızla sürüklediğimizde onunla beraber bir panel geliyor. Ve biz o panelin içerisine istediğimiz nesneyi koyabiliyoruz. İşte tüm bunlara SlidingDrawer diyoruz.

Onun dışında gördüğünüz ekranda 3 adet buton var. butonuna tıklandığında SlidingDrawer açılacak, kapat butonuna tıklandığında kapanacak, değiştir butonuna tıklandığında ise açıksa kapanacak, kapalıysa açılacak.

SlidingDrawer'ımızın içerisine de bir adet check box yerleştirdik ve bunun adını da "kilitle" yaptık. Yani SlidingDrawer açıldığında kilitle kutusu işaretlenirse SlidingDrawer kapatılamayacak.

Ve ve ve işi biraz daha sulandırıp SlidingDrawer açıldığında sanki ekranın üstüne vurmuş gibi bir ses efekti vereceğiz. Yani SlidingDrawer açıldığında bir mp3 dosyası çalacağız diyebiliriz.

Uygulamamız bundan ibaret şimdi hemen gördüğünüz ekranın tasarımını yapalım. Zaman kaybetmeden sliding.xml ve Slider.java dosyalarımızı oluşturuyoruz ve raw klasörünün içerisine ses_efekt adında bir .mp3 uzantılı dosya atıyoruz.

sliding.xml dosyası:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">

<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Aç"
android:id="@+id/bAc" />

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Değiştir"
android:id="@+id/bDegistir" />

<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Kapat"
android:id="@+id/bKapat" />

</LinearLayout>

<SlidingDrawer
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:content="@+id/content"
android:handle="@+id/handle"
android:id="@+id/sdSlider">

<LinearLayout
android:id="@+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<CheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Kilitle"
android:id="@+id/cbKilitle" />
</LinearLayout>

<Button
android:id="@+id/handle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Sürükle" />
</SlidingDrawer>
</FrameLayout>

Tasarım kısmımızda dikkat edilmesi gereken bir nokta var. O da FrameLayout kullanmış olmamız. Eğer FrameLayout kullanmamış olsaydık SlidingDrawer en üst kısma kadar değil ekranımızdaki üç buton nerede bitiyorsa onların bittikleri hizaya kadar çıkacaktı. Bu dipnotu da verdikten sonra artık işin kod kısmına geçebiliriz.

Slider.java dosyası:

package com.hakancengiz.blogders;

import android.app.Activity;
import android.media.MediaPlayer;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.CheckBox;
import android.widget.CompoundButton;
import android.widget.SlidingDrawer;

public class Slider extends Activity implements View.OnClickListener, CompoundButton.OnCheckedChangeListener, SlidingDrawer.OnDrawerOpenListener{

Button ac, kapat, degistir;
CheckBox kilitle;
SlidingDrawer slider;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.sliding);

ac = (Button) findViewById(R.id.bAc);
kapat = (Button) findViewById(R.id.bKapat);
degistir = (Button) findViewById(R.id.bDegistir);
kilitle = (CheckBox) findViewById(R.id.cbKilitle);
slider = (SlidingDrawer) findViewById(R.id.sdSlider);

ac.setOnClickListener(this);
kapat.setOnClickListener(this);
degistir.setOnClickListener(this);

kilitle.setOnCheckedChangeListener(this);

slider.setOnDrawerOpenListener(this);
}

@Override
public void onClick(View v) {

switch (v.getId())
{
case R.id.bAc:
slider.open();
break;

case R.id.bKapat:
slider.close();
break;

case R.id.bDegistir:
slider.toggle();
break;
}

}

@Override
public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {

if(kilitle.isChecked())
{
slider.lock();
}
else
{
slider.unlock();
}

}

@Override
public void onDrawerOpened() {

MediaPlayer cal = MediaPlayer.create(this, R.raw.ses_efekt);
cal.start();

}
}

Kod kısmımız uzun gelebilir fakat biraz incelediğinizde hiç göründüğü gibi olmadığını fark edeceksiniz. Satırlık kodlarla burada işimizi halledediyoruz. Son olarak yine activity'mizi AndroidManifest.xml dosyamızda tanıtmayı unutmayalım.

Hiç yorum yok :

Yorum Gönder