Fluent HTML

[hi_selamlar]

(10-06-2019, Saat: 13:45)uparlayan Adlı Kullanıcıdan Alıntı: Bazen bana rahat batıyor... Sanırım aşağıdaki yazıda bunun sebebini daha kolay anlatabileceğim

Zaman zaman C# ile ilgili eğitim videolarını izlerken bazen C# kodu içerisinde HTML kodlarını da çağırdıklarına şahit oluyorum. Bunun sebebi muhtemelen C#'daki bir library veya framework olabilir, o kısmıyla ilgilenmiyorum. Zaten konumuz C#'da html kullanımı da değil açıkçası... Benim ilgilendiğim nokta, odaklandığım kısım, bu olayı Delphi'de nasıl yapabiliriz idi. Yani Delphi'nin kod tamamlama işlevini HTML taglarını kullanabilir hale nasıl getirebiliriz ve bunu doğrudan HTML taglarını kullanarak nasıl bir HTML verisi üretebiliriz çerçevesinde idi...

Eski yazılarımı takip eden arkadaşlar bilirler. Yazılarımdan birinde Fluent Design ile ilgili bir makale yayınlamıştım. O yazımda XML dosyalarını daha kolay, akıcı üretebilmek için bir örnek vermiştim. Fluent Design'ın felsefesini dilim döndüğünce anlatmaya çalışmıştım. Aynı bilgileri yeniden vermenin bir anlamı yok, zira orada anlatılanlar burada da geçerli, o nedenle işin Fluent Design ile ilgili kısmını es gekiyorum ama desenle ilgilenenler, aşağıdaki bağlantıdan o yazıya ulaşabilirler;

http://www.delphican.com/showthread.php?tid=1330

Neyse, Rahat battı ya! Aynı tekniği HTML için de uyarlayabilir miyim diye düşünmeye başladım. Bunu bir denemek istedim. Bunun için HTML taglarının genel yapısını bilmek gerekiyordu, haliyle biraz araştırma yapıp bu tagların ortak "niteliklerini" bir nesnede topladım. Bu noktada Fluent Design yapısını kullanarak bir nesne tanımladım ama iş nesneyi tanımlamakla elette bitmiyordu. Bu seferki örnekte sadece nesnel programlama tekniklerini değil, aynı zamanda prosedürel programlama tekniklerini de işin içine kattım ve ortaya ( en azından benim ihtiyaçlarım açısında ) düzgün bir yapı çıkmış oldu.

Son halini github üzerindeki depomdan temin edebilirsiniz. @Tuğrul HELVACI Üstadın da dediği gibi "Allah Razı Olsun Ware'dir"... Tepe tepe kullanın ama şu fakirin adımı anmayı da unutmayın

https://github.com/uparlayan/FluentHTML

Kullanımı ise gayet basit. Aşağıdaki örnek kodu okuduğunuzda ve HTML'e de aşinaysanız zaten çok kolay bir şekilde adapte olacağınıza eminim.

uses
   Classes_HTML5_            //  THTMLTag Class definition
 , Methods_HTML5_            //  HTML Tags definitions...
 ;

...
...
...

procedure TWebModule.PageProducer1HTMLTag( Sender          : TObject
                                        ; Tag             : TTag
                                        ; const TagString : string
                                        ; TagParams       : TStrings
                                        ; var ReplaceText : string
                                        );
var
 aHTML: THTMLTag;
begin
  try
    if  SameText(TagString, 'userprofile') then begin
      aHTML:= table([
                      thead([
                              tr( [ th('Kullanıcı Profili').colspan('2')              ])
                            , tr( [ th('Alan')          , th('Değer')                 ])
                            ])
                    , tbody([
                              tr( [ td('ID')            , td(Oturum.User.ID.ToString) ])
                            , tr( [ td('Kullanıcı Adı') , td(Oturum.User.UserName)    ])
                            , tr( [ td('Şifre')         , td(Oturum.User.Password)    ])
                            , tr( [ td('Ad Soyad')      , td(Oturum.User.AdSoyad)     ])
                            , tr( [ td('Eposta')        , td(Oturum.User.Eposta)      ])
                            , tr( [ td('Dil')           , td(Oturum.User.Dil)         ])
                            , tr( [ td('Durum')         , td(Oturum.User.Durum)       ])
                            ])
                    ]).class_('vg');
 
      ReplaceText := aHTML.ToString;
  end else
  if  SameText(TagString, 'userprofileform') then begin
      aHTML:= form(
              [ fieldset('Kullanıcı Profilinizi Düzenleyin')
              , label_( 'Kullanıcı Adı'   , [ br, input.placeholder('Lütfen bir kullanıcı adı belirtin'     ).id('username_id').name('username').value('').type_('text').autocomplete('off') ])
              , br
              , label_( 'Şifreniz'        , [ br, input.placeholder('Lütfen 8 basamaklı bir şifre yazınız'  ).id('password_id').name('password').value('').type_('password').autocomplete('off') ])
              , br
              , label_( 'Ad ve Soyadınız' , [ br, input.placeholder('Lütfen tam adınızı yazınız'            ).id('fullname_id').name('fullname').value('').type_('text').autocomplete('off') ])
              , br
              , label_( 'Eposta Adresiniz', [ br, input.placeholder('Size ait Eposta adresinizi yazınız'    ).id('emailadr_id').name('emailadr').value('').type_('text').autocomplete('off') ])
              , br
              , label_( 'Arabirim Dili'   , [ br, input.placeholder('Bu siteyi hangi dilde kullanacaksınız?').id('language_id').name('language').value('').type_('text').autocomplete('off') ])
              ]).action('/profileedit').method('post');
      aHTML:= table([
                      thead([
                              tr( [ th('Kullanıcı Profili').colspan('2')               ])
                            , tr( [ th('Alan')          , th('Değer')                 ])
                            ])
                    , tbody([
                              tr( [ td('ID')            , td(Oturum.User.ID.ToString) ])
                            , tr( [ td('Kullanıcı Adı') , td(Oturum.User.UserName)    ])
                            , tr( [ td('Şifre')         , td(Oturum.User.Password)    ])
                            , tr( [ td('Ad Soyad')      , td(Oturum.User.AdSoyad)     ])
                            , tr( [ td('Eposta')        , td(Oturum.User.Eposta)      ])
                            , tr( [ td('Dil')           , td(Oturum.User.Dil)         ])
                            , tr( [ td('Durum')         , td(Oturum.User.Durum)       ])
                            ])
                    ]).class_('vg');
      ReplaceText := aHTML.ToString;
  end else
  begin
    { Standart else sonu }
  end;
  finally
    if Assigned(aHTML) then FreeAndNil(aHTML);
  end;
end;

Merhabalar,

Bütün paylaşımlarınız her zaman ki gibi çok güzel.
Elinize sağlık, çok teşekkürler.

Kolay gelsin.