19 Kasım 2016 Cumartesi

Vaadin Müşteri Uygulaması - 1

     Selamün Aleyküm,
     Bir nedenle vaadinle tanıştık. Onla ilgili de bir şeyler karalamak istedim. Türkçe kaynak zaten yok. Sadece aşağıdaki bu linkte 3 yazı var. Başlangıç ve kurulum için iyi olabilir. Bana da faydası olmuştu, fakat devamı gelmemiş maalesef. Ben de yaptığım projeyi burada elimden geldiğince anlatmaya çalışacağım. Proje'nin tamamına yakınını da github'den alabileceksiniz. Projeyi sıcağı sıcağına yazmak lazımdı. Üzerinden zaman geçince biraz zor oluyor. Ama elimizden geldiğince anlatmaya çalışacağım yine de. Ufak bir başlangıçtan sonra başlayalım.



     Projemizde 4 temel sınıfımız var, fakat biz çoğunlukla bir sınıfımız üzerine yoğunlaşacağız. Bunun sebebi asıl işlemlerimizin burada yapmış olma sebebimizdir, tüm projeyi indirip kendiniz de inceleyebilirsiniz. Biz öncelikle formumuzu oluşturacağımız sınıfı inceleyeceğiz.

     public Field createField(Item item, Object propertyId, Component uiContext) {
String propertyName = (String) propertyId;
if (propertyName.equals("birthCity")) {
Select select = new Select("Birth City");
select.setRequired(true);
select.setNullSelectionAllowed(false);
select.setRequiredError("Please Select City");
select.addItem("Şehirleri Buraya Ekleyebiliriz");
return select;

} else if (propertyName.equals("name")) {
TextField textField = new TextField("Name");
textField.setRequired(true);
textField.setRequiredError("Name is missing!!");
return textField;
}
           return null;
   }
   
Resim-1

     Kod ve resmimi birlikte incelemeye çalışalım. Kod kısmında sadece şehir ve isim kısmını aldık. Diğer kısımlar da benzer mantıkla oluşturabiliriz, fakat uzun olmaması açısından burada göstermedik. Alanların zorunlu olmasını istedik. O yüzden alanlarımızı zorunlu yaptık. Boş geçtiğimiz takdirde bize bir uyarı verecektir. Zaten etiketlerin yanındaki kırmızı yıldızları da görmektesiniz. Bu alanlar doldurulması zorunludur diye. Açılır listeyi de boş geçmememiz lazım orada da yine benzeri bir hata ile karşılaşacağız. "Send" düğmesi ile kaydı veri tabanına kaydedebiliyoruz. "Reset" ile tüm alanlar sıfırlanabilir.

      Şimdi de oluşturduğumuz bu formu görüntülemeye geldi.
        mainLayout = new VerticalLayout();//ekranımızı oluşturuyoruz
Form baglanacakForm = new Form();//yeni bir form oluşturduk
baglanacakForm.setCaption("Customer Form");//formun ismini verdik
        baglanacakForm.setFormFieldFactory(new KullaniciFormFieldFactory());
baglanacakForm.setItemDataSource(beanItem);

     Oluşturduğumuz sınıfı buraya göstererek oluşturduğumuz alanları haber veriyoruz. Vaadin'de her eklediğimiz alanı forma veya nereye ekleyecekseniz ora ile bağlantısını kurmak zorundasınız. Biz kullandığımız nesne bağlanacak form olduğu için oraya set ettik. 

Vector<String> order = new Vector<String>();
order.add("name");
order.add("surname");
order.add("gender");
order.add("birthDate");
order.add("birthCity");
order.add("flag");

baglanacakForm.setVisibleItemProperties(order);
        Eğer alanların sıralamasını değiştirmek isterseniz onu da yukarıdaki gibi yapabiliriz. Düzenleme bittikten sonra onu yine formumuza bildiriyoruz.

       // tab1 start
TabSheet tabsheet = new TabSheet();//tab oluşturuyoruz

VerticalLayout myTabRoot = new VerticalLayout(); //ilk sekmeyi oluşturuyoruz

myTabRoot.addComponent(baglanacakForm);//formu burada gösteriyoruz
myTabRoot.addComponent(buttonSend);//gönder ve sıfırla düğmelerini
myTabRoot.addComponent(reset);//yine buraya ekliyoruz

tabsheet.addTab(myTabRoot);//daha sonra sekmemizi taba kaydediyoruz
tabsheet.getTab(myTabRoot).setCaption("First Tab");//isim veriyoruz.

   Şimdilik yazımıza burada son verelim. Buraya kadar projemizin genel yapısı ve 1.nci sekmeyi anlatmaya çalıştım. 2. ve 3. sekmeler de başla yazıların konusu olsun. İyi çalışamalar dilerim.
       
             



   

Hiç yorum yok:

Yorum Gönder