Mephistophelés
Bronz Üye
-
- Katılım
- Eylül 10, 2012
-
- Mesajlar
- 3,744
-
- Tepkime puanı
- 2
-
- Puanları
- 293
-
- Yaş
- 48
Giriş
Ribbon, orjınal olarak Office team tarafından kendi uygulamalarının karmaşık sistemlerinin menülerini ve toolbarlarını değiştirmek için dizayn edilmiştir. Windows 7’de, Microsoft, geçerli Win32 uygulamalarında kullanmak için COM tabanlı yeniden kullanılabilir bir Ribbon eklentisini güncelledi. Geçerli Ribbon, Office, WPF ve MFC deki diğer Ribbon eklentilerinden biraz farklıdır, ama onların hepsi aynı tasarım ve işlevselliği paylaşırlar.
Ribbon’un bir sürü özelliğinden dolayı, bu ilk makale sadece Ribbon’un temellerini ve COM arayüzlerini kapsayacak ve basit bir Ribbon kullanan bir uygulamayı baştan itibaren oluşturulmak için gerekli adımları gösterecek. Eğer Ribbon gelişmelerine yada yakında çıkacak WTL 8.1 Ribbon sınıflarına dalmak isterseniz CodeProject’teki diğer Ribbon makalelerini kontrol edebilirsiniz.
Basit bir kod derlemek için sistem gereksinimleri, Visual Studio 2008, WTL 8.0 ve Windows 7 SDK yeterlidir. Eğer Windows 7 yada Server 2008 R2 kullanıyorsanız, gerekli olan herşeye sahipsiniz demektir. Eğer Vista veya Server 2008 kullanıyorsanız, işletim sisteminizde Ribbon kullanmak için servis pack 2 ve Description of the Platform Update for Windows Server 2008 and the Platform Update for Windows Vista uygulamalarını indirmelisiniz.
Yeni bir uygulamaya başlama
CmainFrame de çalışmaya başlama
WTL AppWizard tarafından oluşturulmuş olan temel SDI uygulaması ile başlayacağız. Bu uygulama bir toolbar’a sahip olmayacak (Ribbon toolbar’ı değiştirdiğinden dolayı), ama bir durum çubuğuna sahip olucak. Görüntüleme penceresi için ayrı bir sınıfı kullanır, ama Ribbon’un gelişmesine ve çalıştırılmasına odaklanacağımız için bu görüntüleme penceresi çok fazla şey yapmayacağız. Daha sonra, ana yapının child kontrollerini tasarlamaya gelindiği zaman, bu görüntüleme penceresi ile daha çok şey yapacağız.
İlk adım, Ribbon’un kullanılması için bize gerekecek tipleri ve arayüzleri tanımlayan, UIRibbon.h’nin include edilmesidir. Uygulamamız bu arayüzlerin ikisinide derleyecektir, ve bu derleme detayları makalenin geri kalan kısmında anahatları ile belirtilecektir. Herşeyden önce, ihtiyaç duyduğumuz herşey, CmainFrame kalıtım listesine IUIApplication’u eklenmesidir, daha sonra 3 metodun stub derlemelerini ekleriz.
CmainFrame bir COM nesnesi olması gerekene kadar, CcomObjectRootEx’ten türeyecektir. Birde, Run() fonksiyonundaki CmainFrame örneği CcomObjectRootStackEx kullanılarak oluşturulacaktır, IUnknown’un ATL derlemesini kullanmak için:
Uiframework’ün kurulumu
Ribbon ile sahip olduğumuz ilk etkileşim, IUiframework arayüzü aracılığı iledir, CmainFrame Framework’ü başlatmak ve kapatmak için bu arayüzü kullanır, bu nedenle, uygulamanın kullanıldığı sürece bir arayüz işaretçisi tutmak zorundadır.
CmainFrame: : OnCreate ()’de, Framework’ün COM nesnesini oluştururuz:
IUiframework : : Initialize(), Ribbon bulunan pencerenin HWND’sini alır, ve Framework olan IUIApplication arayüzü uygulama ile bağlantı sağlayacaktır, Bu framework, Ribbon’un görsel esas noktaları ile uyumlu olması için, pencerenin görüntüsünü değiştirir. Örnek olarak, framework windows menülerini ve etkin yazı çubuğundaki çizim kontrollerini değiştirir. Bu özelliklerin düzgünce çalıştığını kontrol etmek için, framework WS_CAPTION stili ile ve WS_EX_TOOLWINDOW stili olmadan, üst kısımda bir penceresi olan bir pencere gerektirir.
Eğer pencere bu durumları karşılamaz ise, IUiframework : : Initialize(), ERROR_INVALID_WINDOW_HANDLE hatası döndürecektir.
Framework’ü tam anlamıyla kapatmak ve kullandığı kaynağı serbest bırakmak için, birde WM_DESTROY handler’in deki IUiframework : : Destroy()’u çağımamız gerekir
IUiframework : : Initialize() ’a çağrımızı eklememizin ardından, frame penceremiz şu şekilde gözükecektir.
Ribbon’umuzun içeriğini henüz tanımlamadığımızdan dolayı henüz hiçbir Ribbon yoktur, tabiki, ama framework, menü çıkarmaya benzer zorunlu görsel eklentiler meydana getirdi.
Bir Ribbon’u Uygulamaya Eklemek
Ribbon, daha önce kullandığınız UI bileşenlerinden farklı çalışır. Tasarım ilkelerinden biri bir Ribbon’un içeriğinin tanımının, görsel tasarımından ayrı olması gerektiğidir. Bir uygulama Ribbon’da hangi komutların görüntülendiğini, bunların nasıl organize edildiğini ve gruplandırıldığını ayrıntılı olarak belirtebilir ve daha fazlasını. Ama uygulama, Ribbon’un aslında nasıl görüneceğini sınırlandırır. Bu iletişim kaynakları gibi GUI’nin oluşturulmasının mevcut yollarından daha az uyumluluk sorunu ile gelecekte Microsoft’un Ribbon’un görünüşünün değiştirmesine izin verir.
Bir Ribbon tanımlamanın adımları:
1- Ribbon’un içeriğini tanımlayan bir XML belgesi oluşturunuz ve bu dosyayı projenize ekleyin.
2- Uicc aracı ile XML belgesini derleyin.
3- Uicc’nin meydana getirdiği dosyaları uygulamanın kaynaklarına ekleyin.
4- Derlenen tanımı kullanan bir Ribbon oluşturmak için IUiframework ::LoadUI() çağırın.
XML dosyasına dalmadan önce, Ribbon’un bileşenlerini tam olarak tanımamız gerekir.
Ribbon Bölümleri
Ribbon birçok yerde, bir komut tasarımını kullanır, Bir komut, bir butondan daha fazladır, aslında bu, Ribbonda tıklayabileceğin ve bununla birçok şey yapabileceğin herhangi birşeydir. Komutlar, bir text etiketi, bir ikon, bir kısayol tuşu gibi çeşitli özelliklere sahiptirler. Bir kere komut listesini oluşturduğunuzda, komutların dışında Ribbon’un diğer bölümlerini oluşturmaya başlarsınız.
Burada çeşitli Ribbon bölümlerinin görüntülendiği Paint penceresinin bir görüntüsü vardır.
1-Uygulama menüsü: İlk tabın solundaki buton, uygulama menüsünü açar. Görünüşünü özelleştirmek için izin vermemesine rağmen, bu komutun kendisidir, Menü diğer komutlarıda içerir.
2-Hızlı erişim toolbarı (QAT): QAT, Ribbon’un pencerenin başlık kısmında çizdiği bir araç çubuğudur. Diğer komutları sağ tıklayıp gelen menüden Hızlı erişim araç çubuğuna ekle seçeneği yardımı ile bu araç çubuğuna ekleyebilirsiniz. QAT’ın sağ tarafında bulunan aşağı ok tuşu, araç çubuğundaki komutları özelleştirebileceğimiz ve Ribbon ve QAT’ın görünümünü değiştirebileceğimiz bir menü görüntüler
3-Tablar: Tab dizisi, XML dosyasında tanımladığın tüm tabları görüntüler. Her tab bir komuttur, ve bir yada daha fazla işlem grubunu kapsar
4-Gruplar: Herbir grup komut koleksiyonudur. Bir grup altta isteğe bağlı bir etikete sahiptir, ve Ribbon grupların arasındaki ayırıcıları çizer. Ara sıra, grup yerine kullanılan terim yığınını görebilirdiniz. Bu resmi bir terim değildir, ama Office takımı tarafından ilk Ribbon oluşturulduğunda kullanılmıştı, ve blog mesajları gibi gayri resmi yazılan materiyallerde kullanılır.
XML Dosyasına Başlamak
Başlangıç noktamız olan XML dosya iskeletimiz burdadır:
Dikkat ederseniz, XAML benzer şekilde "object.property" adlandırma kuralları ile bazı özellikler child taglarını kullanmak için yazılmıştır. Örnek olarak, <Application.Commands>, <Application> tagının Commands özelliğini tanımlar.
Ilk adım <Ribbon> bölümlerinde kullanacağımız birkaç komutu oluşturmak içindir, Herbir komut, bir <Command> tagını tanımlar. <Command> daha sonra göreceğimiz birkaç özelliğe sahiptir, ama şuan için, Name ve LabelTitle olan iki tanesini kullanacağız, Name özelliği XML dosyasının sonundaki komutu tanımlayan bir stringdir, ve LabelTitle UI bileşeninin text’inin atandığı bir stringdir.
Bir buton oluştumak için, onu yerleştireceğimiz bir grup ve tab’a gerek duyarız, böylece 3 komutla başlarız.
(Microsoft benim gördüğüm örneklerinde, tüm komut isimlerinin öneklerinde "cmd" kullanmıştır, ama ben herbir komutun işlevine göre daha tanımlayıcı önekler tercih ettim) Sonra bir grup içinde bir tab, bir grup ve buton kontrolleri oluştururuz.
Bu bir grup içeren bir tab oluşturur. Tab özelliklerinin çoğu <Command> tagı ile ilişkili olarak gelir. Burada dolaylı bir seviye bulunur: Tab’ın text’inin ne olduğunu belirtmezsiniz, tabın hangi komutu olduğunu belirtirsiniz, Ribbon, ilgili <Command> etiketinde text’i arar. Benzer şekilde, grubun etiketi grbHello komutunun LabelTitle özelliğinden gelir. Şuan için SizeDefinition özniteliği hakkında endişelenmeyin, Ribbon’un grubun içindeki kontrolleri nasıl ayarlayacağını bilmesi için gerekli olan bir şeydir sadece.
Sonunda, burada , tıklanan sıradan bir buton oluşturan <Button> etiketi bulunur, Birçok yerde aynı komutlara sahip olunmasını mümkün kıldığı için <Command> etiketlerinde,özelliklerin ayrımı, butonlar için daha kullanışlıdır, ve bu ayrılığın olması ile, komutların görüleceği heryerde aynı özellikleri tekrarlamak zorunda olmazsınız.
Ribbon, orjınal olarak Office team tarafından kendi uygulamalarının karmaşık sistemlerinin menülerini ve toolbarlarını değiştirmek için dizayn edilmiştir. Windows 7’de, Microsoft, geçerli Win32 uygulamalarında kullanmak için COM tabanlı yeniden kullanılabilir bir Ribbon eklentisini güncelledi. Geçerli Ribbon, Office, WPF ve MFC deki diğer Ribbon eklentilerinden biraz farklıdır, ama onların hepsi aynı tasarım ve işlevselliği paylaşırlar.
Ribbon’un bir sürü özelliğinden dolayı, bu ilk makale sadece Ribbon’un temellerini ve COM arayüzlerini kapsayacak ve basit bir Ribbon kullanan bir uygulamayı baştan itibaren oluşturulmak için gerekli adımları gösterecek. Eğer Ribbon gelişmelerine yada yakında çıkacak WTL 8.1 Ribbon sınıflarına dalmak isterseniz CodeProject’teki diğer Ribbon makalelerini kontrol edebilirsiniz.
Basit bir kod derlemek için sistem gereksinimleri, Visual Studio 2008, WTL 8.0 ve Windows 7 SDK yeterlidir. Eğer Windows 7 yada Server 2008 R2 kullanıyorsanız, gerekli olan herşeye sahipsiniz demektir. Eğer Vista veya Server 2008 kullanıyorsanız, işletim sisteminizde Ribbon kullanmak için servis pack 2 ve Description of the Platform Update for Windows Server 2008 and the Platform Update for Windows Vista uygulamalarını indirmelisiniz.
Yeni bir uygulamaya başlama
CmainFrame de çalışmaya başlama
WTL AppWizard tarafından oluşturulmuş olan temel SDI uygulaması ile başlayacağız. Bu uygulama bir toolbar’a sahip olmayacak (Ribbon toolbar’ı değiştirdiğinden dolayı), ama bir durum çubuğuna sahip olucak. Görüntüleme penceresi için ayrı bir sınıfı kullanır, ama Ribbon’un gelişmesine ve çalıştırılmasına odaklanacağımız için bu görüntüleme penceresi çok fazla şey yapmayacağız. Daha sonra, ana yapının child kontrollerini tasarlamaya gelindiği zaman, bu görüntüleme penceresi ile daha çok şey yapacağız.
İlk adım, Ribbon’un kullanılması için bize gerekecek tipleri ve arayüzleri tanımlayan, UIRibbon.h’nin include edilmesidir. Uygulamamız bu arayüzlerin ikisinide derleyecektir, ve bu derleme detayları makalenin geri kalan kısmında anahatları ile belirtilecektir. Herşeyden önce, ihtiyaç duyduğumuz herşey, CmainFrame kalıtım listesine IUIApplication’u eklenmesidir, daha sonra 3 metodun stub derlemelerini ekleriz.
CmainFrame bir COM nesnesi olması gerekene kadar, CcomObjectRootEx’ten türeyecektir. Birde, Run() fonksiyonundaki CmainFrame örneği CcomObjectRootStackEx kullanılarak oluşturulacaktır, IUnknown’un ATL derlemesini kullanmak için:
Uiframework’ün kurulumu
Ribbon ile sahip olduğumuz ilk etkileşim, IUiframework arayüzü aracılığı iledir, CmainFrame Framework’ü başlatmak ve kapatmak için bu arayüzü kullanır, bu nedenle, uygulamanın kullanıldığı sürece bir arayüz işaretçisi tutmak zorundadır.
CmainFrame: : OnCreate ()’de, Framework’ün COM nesnesini oluştururuz:
IUiframework : : Initialize(), Ribbon bulunan pencerenin HWND’sini alır, ve Framework olan IUIApplication arayüzü uygulama ile bağlantı sağlayacaktır, Bu framework, Ribbon’un görsel esas noktaları ile uyumlu olması için, pencerenin görüntüsünü değiştirir. Örnek olarak, framework windows menülerini ve etkin yazı çubuğundaki çizim kontrollerini değiştirir. Bu özelliklerin düzgünce çalıştığını kontrol etmek için, framework WS_CAPTION stili ile ve WS_EX_TOOLWINDOW stili olmadan, üst kısımda bir penceresi olan bir pencere gerektirir.
Eğer pencere bu durumları karşılamaz ise, IUiframework : : Initialize(), ERROR_INVALID_WINDOW_HANDLE hatası döndürecektir.
Framework’ü tam anlamıyla kapatmak ve kullandığı kaynağı serbest bırakmak için, birde WM_DESTROY handler’in deki IUiframework : : Destroy()’u çağımamız gerekir
IUiframework : : Initialize() ’a çağrımızı eklememizin ardından, frame penceremiz şu şekilde gözükecektir.
Ribbon’umuzun içeriğini henüz tanımlamadığımızdan dolayı henüz hiçbir Ribbon yoktur, tabiki, ama framework, menü çıkarmaya benzer zorunlu görsel eklentiler meydana getirdi.
Bir Ribbon’u Uygulamaya Eklemek
Ribbon, daha önce kullandığınız UI bileşenlerinden farklı çalışır. Tasarım ilkelerinden biri bir Ribbon’un içeriğinin tanımının, görsel tasarımından ayrı olması gerektiğidir. Bir uygulama Ribbon’da hangi komutların görüntülendiğini, bunların nasıl organize edildiğini ve gruplandırıldığını ayrıntılı olarak belirtebilir ve daha fazlasını. Ama uygulama, Ribbon’un aslında nasıl görüneceğini sınırlandırır. Bu iletişim kaynakları gibi GUI’nin oluşturulmasının mevcut yollarından daha az uyumluluk sorunu ile gelecekte Microsoft’un Ribbon’un görünüşünün değiştirmesine izin verir.
Bir Ribbon tanımlamanın adımları:
1- Ribbon’un içeriğini tanımlayan bir XML belgesi oluşturunuz ve bu dosyayı projenize ekleyin.
2- Uicc aracı ile XML belgesini derleyin.
3- Uicc’nin meydana getirdiği dosyaları uygulamanın kaynaklarına ekleyin.
4- Derlenen tanımı kullanan bir Ribbon oluşturmak için IUiframework ::LoadUI() çağırın.
XML dosyasına dalmadan önce, Ribbon’un bileşenlerini tam olarak tanımamız gerekir.
Ribbon Bölümleri
Ribbon birçok yerde, bir komut tasarımını kullanır, Bir komut, bir butondan daha fazladır, aslında bu, Ribbonda tıklayabileceğin ve bununla birçok şey yapabileceğin herhangi birşeydir. Komutlar, bir text etiketi, bir ikon, bir kısayol tuşu gibi çeşitli özelliklere sahiptirler. Bir kere komut listesini oluşturduğunuzda, komutların dışında Ribbon’un diğer bölümlerini oluşturmaya başlarsınız.
Burada çeşitli Ribbon bölümlerinin görüntülendiği Paint penceresinin bir görüntüsü vardır.
1-Uygulama menüsü: İlk tabın solundaki buton, uygulama menüsünü açar. Görünüşünü özelleştirmek için izin vermemesine rağmen, bu komutun kendisidir, Menü diğer komutlarıda içerir.
2-Hızlı erişim toolbarı (QAT): QAT, Ribbon’un pencerenin başlık kısmında çizdiği bir araç çubuğudur. Diğer komutları sağ tıklayıp gelen menüden Hızlı erişim araç çubuğuna ekle seçeneği yardımı ile bu araç çubuğuna ekleyebilirsiniz. QAT’ın sağ tarafında bulunan aşağı ok tuşu, araç çubuğundaki komutları özelleştirebileceğimiz ve Ribbon ve QAT’ın görünümünü değiştirebileceğimiz bir menü görüntüler
3-Tablar: Tab dizisi, XML dosyasında tanımladığın tüm tabları görüntüler. Her tab bir komuttur, ve bir yada daha fazla işlem grubunu kapsar
4-Gruplar: Herbir grup komut koleksiyonudur. Bir grup altta isteğe bağlı bir etikete sahiptir, ve Ribbon grupların arasındaki ayırıcıları çizer. Ara sıra, grup yerine kullanılan terim yığınını görebilirdiniz. Bu resmi bir terim değildir, ama Office takımı tarafından ilk Ribbon oluşturulduğunda kullanılmıştı, ve blog mesajları gibi gayri resmi yazılan materiyallerde kullanılır.
XML Dosyasına Başlamak
Başlangıç noktamız olan XML dosya iskeletimiz burdadır:
Dikkat ederseniz, XAML benzer şekilde "object.property" adlandırma kuralları ile bazı özellikler child taglarını kullanmak için yazılmıştır. Örnek olarak, <Application.Commands>, <Application> tagının Commands özelliğini tanımlar.
Ilk adım <Ribbon> bölümlerinde kullanacağımız birkaç komutu oluşturmak içindir, Herbir komut, bir <Command> tagını tanımlar. <Command> daha sonra göreceğimiz birkaç özelliğe sahiptir, ama şuan için, Name ve LabelTitle olan iki tanesini kullanacağız, Name özelliği XML dosyasının sonundaki komutu tanımlayan bir stringdir, ve LabelTitle UI bileşeninin text’inin atandığı bir stringdir.
Bir buton oluştumak için, onu yerleştireceğimiz bir grup ve tab’a gerek duyarız, böylece 3 komutla başlarız.
(Microsoft benim gördüğüm örneklerinde, tüm komut isimlerinin öneklerinde "cmd" kullanmıştır, ama ben herbir komutun işlevine göre daha tanımlayıcı önekler tercih ettim) Sonra bir grup içinde bir tab, bir grup ve buton kontrolleri oluştururuz.
Bu bir grup içeren bir tab oluşturur. Tab özelliklerinin çoğu <Command> tagı ile ilişkili olarak gelir. Burada dolaylı bir seviye bulunur: Tab’ın text’inin ne olduğunu belirtmezsiniz, tabın hangi komutu olduğunu belirtirsiniz, Ribbon, ilgili <Command> etiketinde text’i arar. Benzer şekilde, grubun etiketi grbHello komutunun LabelTitle özelliğinden gelir. Şuan için SizeDefinition özniteliği hakkında endişelenmeyin, Ribbon’un grubun içindeki kontrolleri nasıl ayarlayacağını bilmesi için gerekli olan bir şeydir sadece.
Sonunda, burada , tıklanan sıradan bir buton oluşturan <Button> etiketi bulunur, Birçok yerde aynı komutlara sahip olunmasını mümkün kıldığı için <Command> etiketlerinde,özelliklerin ayrımı, butonlar için daha kullanışlıdır, ve bu ayrılığın olması ile, komutların görüleceği heryerde aynı özellikleri tekrarlamak zorunda olmazsınız.
nCreate() den IUiframework::LoadUI() i çağırarak bunu yaparız.
