https://www.youtube.com/watch?v=LPFRUoq5NZg&t=1759s
Eğitim İçeriği
Bölüm #1
- Action nedir?
- Action ile neler yapılır?
- Küçük bir demo
Bölüm #2
- Share Sheet kullanımı
- TabAction kullanımı
- Örnek uygulamalar.
Action Nedir?
Yapılması gereken işlemleri paket haline getiren kısaltan olaylardır. Uygulamanın en küçük yapı taşı gibi düşünülebilir. Bu olayları bütünleştirdiğimizde ortaya fonksiyonlar çıkar. Fonksiyonların bir araya gelmeside uygulamamızı oluşturur.
Action ile Neler Yapılır?
- Kod revizyonunu kolaylaştırır.
- Kod verimliliğini arttırır.
- Etkili ve hızlı arayüz geliştirme sağlar.
- Standartlarınızı korumanızı sağlar.
- Pratik kullanımı ile kolay prototip çıkartmanızı sağlar.
- Tekrar eden işlemleri hızlandırır.
- Aynı kodu birden fazla yöntemle çalıştırabilmeyi sağlar.
DEMO
Uygulamamızı açıyoruz. File > New > Multi device application > Blank Application. Palette bölümünden Action List ekliyoruz. Eklediğimiz Action Liste çift tıklayarak yada sağ tuş> Action List Editor’e tıklayarak Action listesine ulaşabiliyoruz.
Açılan listeye sağ tuş> New Action seçeneğiyle action oluşturabilirsiniz. Uygulamamızın içine yeni bir action oluşturuyoruz. Action > object inspector > name →HelloWorldAction - text →Hello World şeklinde isimlendiriyoruz. Object inspector> category > kısmından action’ı kategorilendirebiliyoruz. Bu bize daha yönetilebilir bir sistem sağlıyor. Biz catgory kısmına main değerini vererek kategorilendiriyoruz.
Action’ın object inspector kısmında bulunan UnsupportedPlatforms ve UnSupportedArchitectures alanları actionların seçili platformlarda aktif olup olmayacağını anlayabileceğimiz alanlardır.
TActionların event kısmına geliyoruz burada 3 fonksiyonumuz var.
OnExecute : Doğrudan bir action’ın çalışması execute olmasıyla alakalıdır. Eğer componentin adıyla çağırırsak HelloWorldAction.Execute yaparsak otomatik olarak çağrılmış olur. Eğer doğrudan bir componente çağrılacağın yer gönderenin bu componenttir dersek otomatik olarak bu compomnent bunu tetiklemiş olur. Tetikleme esnasında koda müdahale etmek istersek OnExecute alanında herhangi bir değer girebiliriz. OnExecute kısmına çift tıklıyoruz bizim için procedure oluşturuluyor.
procedure TForm1.HelloWorldActionExecute(Sender : TObject);
begin
ShowMessage(‘Hello World : OnExecute’ );
end;
Formumuza geçelim ve HelloWorld fonksiyonumuzu bir butona bağlıyalım. Button ekliyoruz. Button1> object inspector> action ve istediğimiz action seçiyoruz. Bağlantı sağlandı butonumuzda fonksiyonumuzun text’indeki HelloWorld yazıyor. Buttonumuzun object inspector’ındaki action alanının solundaki > (büyüktür) sembolüne tıklayarak actiona gitmeden burada düzenlemeler yapabiliriz. Bu haliyle çalıştırıyoruz ve butona tıklayınca HelloWorld : OnExecute mesajını görüyoruz.
Standart Action : Sınıflardan türetilen componentlere bağlı olarak geliştirilmiş olan actionları kapsar.
TControlAction : Tamamen bir kontrole bağlı olarak ve o kontrolün yönetebileceği kontrollerle alakalı actionları oluştururken kullanılır.
BÖLÜM #2
Share Sheet : Mobil cihazlardaki paylaş butonu ve bu paylaş butonundan çıkan pop-up’un yönetimini sağlayan bir actiondır. Share sheet ile resim ve metin paylaşımı yapılabiliyor. ShowShareAction.BeforeExecute burada action execute edilmeden hemen öncesini algılayıp yapmak istediğiniz değişiklikleri üzerine atayarak işlemlerini hazır hale getirmiş oluyor. Bu sayede kullanıcı bir resmi ya da metni kolaylıkla paylaşabiliyor. Action componentinin üzerinde doğrudan bir bitmap ve textmessage alanlarını kullanarak bu işlemleri gerçekleştiriyoruz.
ShareSheet ile demo
Uygulamamız şu şekilde çalışıyor Take Photo ile fotoğrafımızı çekiyorve share ile paylaşım kutucuğu açılıyor ve gönderim gerçekleşiyor. ShareSheet Embarcadero’nun örnek kodları arasında yer alan bir proje. Share sheet’in action ile ilgili gerçek bir ortamdaki örnek kodlarını birlikte inceleyelim.
Action liste çift tıklıyoruz, 3 action eklenmiş olduğunu görüyoruz. Bunlar;
ShowShareSheetAction1 → Fotoğrafı paylaşmak için bir action
Action1
TakePhotoFromCameraAction1→Kameradan fotoğrafı çekmemizi sağlayan bir action
New standart action classes penceresinden bu actionu görebiliriz. Bu action çekme işlemini tamamladığında hangi işlemleri yapıyormuş inceleyelim.
procedure TShareSheetForm.TakePhotoFromCameraAction1DidFinishTaking(Image:TBipmap);
begin
{display the Picture taken from the camera to the Image control}
ImgCameraPicture.Bitmap.Assign(Image);
end;
ImgCameraPicture adında bir compenenti var. Bu componentin üzerine doğrudan kendisine gelen anlık çekilen resmin bitmap dosyasını assign ediyor.
ShowShareSheetAction’ ın event’ında OnBeforeExecute var. Buraya çalışmadan öncesinde yapmak istediğimiz işlemi atıyoruz. Bu action’ın kodlarını inceleyelim;
procedure TShareSheetFormçShowShareSheetAction1BeforeExecute(Sender : Object);
begin
{Show the share sheet}
ShowShareSheetActin1.Bitmap.Assign(ImgCameraPicture.Bitmap);
end;
ShareSheetAction’ı açmadan önce içerisine arayüzündeki ImgCameraPicture.Bitmap.Assign ediyoruz böylelikle paylaşma ekranını size sunmuş oluyor
TabAction Kullanımı
Standart Action;
NextTab(TNextTabAction)
PreviousTab(TPrevious TabAction)
Title(TControlAction)
3 Fonksiyon belirledik.
Title : Aktif ettiğimiz tab’ın hangi başlığa aitse onu yazması için.
Next Tab ve Previous Tab : Tablolar arasında bir öncekine bir sonrakine geç işlemini yaparlar.
Yeni bir uygulama oluşturuyoruz. File> New> Multi Device Application> Blank application. Uygulamamıza bir TabControl ekliyoruz. Palette> toolbar ekliyoruz ve içerisine 2 adet button ve 1 adet label ekliyoruz. TabControl’ün üstüne sağ tuş 4 adet item ekliyoruz. TabControl > align > center – Button1 >align > left – Button2 > align > right – label1>align > client – label1> horzalign >center seçtik bu sayede label’a yazdığımız text’in ortalanmasını sağlıyoruz. Componentlerimiz hazır.
Gesture Management ve Action list ekleyelim. Action liste çift tıklayarak açalım. Listeye sağ tuş > Standart Action List içerisinden Next TabAction, Previous TabAction, Control Action seçelim. Control Action >name → title action olarak değiştirdik. Standart Action classes da tab grubundan aldığımız için hepsini tab isminde otomatik bir kategorilendirilme yapıldığını görüyoruz.
Gesture Manager: Kullanıcının arayüzde yapacağı parmak hareketlerini algılayan bir component yönetici sınıfı. Bu sınıfın erişimi için tab üzerinde Touch> Gesture Manager alanında Gesture Manager seçerek bağlamasını yapıyoruz. Böylelikle tabControl içerisinde OnGesture olayına çift tıklayıp yazmak istediğimiz event’ı yazıyoruz. Parametre EventInfo’su geliyor.
procedure TForm1.TabControlGesture(Sender : Object const EventInfo: TGestureEventInfo :var Handled :Boolean) ;
begin
case EventInfo.GestureID of
sgiLeft:
begin
TabControl.Next;
Handled:= true;
end;
sgiRight:
begin
TabControl.Previous;
Handled:= true;
end;
end;
end;
Left bir sonraki sayfaya geç yani tabcontroldeki bir sonraki sayfasına geç analamındadır. Right ise önceki sayfaya gider.
Arayüzümüzü tasarlayalım. Buttonların görüntüsü için object inspectorda > style lookup içerisinde uygun bulduklarınızı kullanabilirsiniz. Biz sol için < sağ için > sembollerini kullandık. Label’ın action’ına titleActionu bağlıyoruz. TitleActionu execute edebilmek için olayını anlamamız gerek. Butonlara bastığımızda hangi tab aktifse o tab TitleActionda yazsın istiyoruz. TabItemlara isimlendirme yapalım. TabItem1 > name→ 1.adım – TabItem2>name →2.adım- TabItem3> name → 3.adım- TabItem4> name→ 4.adım. Daha iyi bir görüntü için TabPosition > none yaptık. Geçişleri net görebilmek için her bir sayfaya farklı componentler yerleştiriyoruz. Sırayla actionları bağlayalım. Button1> action> Previous TabAction – Button2> action > Next TabAction . Label1> text → lblTitleAction tab geçişlerine göre title’ın güncellenmesi için ActionList> object inspector >OnUpdate çift tıklıyoruz.
procedure TForm1.ActionListupdate(Action : TBasicAction var Handled : Boolean);
var
Ltab :TTabItem;
Begin
Ltab := TabControl.ActiveTab;
İf Action = TitleAction then
LblTitleAction.Text:= Ltab.Text;
Update olduktan sonra aktif tab’ı ele alarak o tab’ın içerisindeki title değerini kontrol ederek label’a atamış olduk. Action tablolarımızda doğrudan hangi actionu yöneteceğini bildirmemiz gerekiyor bunun içinde Next TabAction> object inspector >TabControl de tabcontrol seçtik. Bunu hepsi için uyguluyoruz. Çalıştırıyoruz çalıştığı anda TitleActionda 1.adım yazdığını görüyoruz ve geçişler sağlanıyor güncellemeler yapılıyor.
