Xamarin.Android Tasarım Aracı temel bilgileri

Bu konu Xamarin.Android Tasarım Aracı özelliklerini tanıtır, Tasarım Aracı nasıl başlatıldığını açıklar, Tasarım Yüzeyi'ni açıklar ve pencere öğesi özelliklerini düzenlemek için Özellikler bölmesinin nasıl kullanılacağını açıklar.

Visual Studio

Tasarım Aracı başlatma

Tasarım Aracı, bir düzen oluşturulduğunda otomatik olarak başlatılır veya mevcut bir düzen dosyasına çift tıklanarak başlatılabilir. Örneğin, Kaynaklar Düzeni klasöründe activity_main.axml'ye çift tıklanması, bu ekran görüntüsünde görüldüğü gibi Tasarım Aracı yükler: >

Benzer şekilde, Çözüm Gezgini düzen klasörüne sağ tıklayıp Yeni Öğe Ekle... seçeneğini belirleyerek yeni bir düzen ekleyebilirsiniz. > > Android Düzeni:

Bu, yeni bir .axml düzen dosyası oluşturur ve Tasarım Aracı yükler.

İpucu

Visual Studio'nun daha yeni sürümleri, Android Tasarım Aracı içinde .xml dosyaları açmayı destekler.

Android Tasarım Aracı hem .axml hem de .xml dosyaları desteklenir.

Tasarım Aracı özellikleri

Tasarım Aracı, aşağıdaki ekran görüntüsünde gösterildiği gibi çeşitli özelliklerini destekleyen birkaç bölümden oluşur:

Tasarım Aracı bir düzeni düzenlerken, tasarımınızı oluşturmak ve şekillendirmek için aşağıdaki özellikleri kullanırsınız:

• Tasarım Yüzeyi – Düzenin cihazda nasıl görüneceğine ilişkin düzenlenebilir bir gösterim vererek kullanıcı arabiriminin görsel olarak oluşturulmasını kolaylaştırır. Tasarım Yüzeyi Tasarım Bölmesi'nin içinde görüntülenir (Tasarım Aracı Araç Çubuğu üzerinde konumlandırılır).

• Kaynak Bölmesi – Tasarım Yüzeyi'nde sunulan tasarıma karşılık gelen temel XML kaynağının bir görünümünü sağlar.

• Tasarım Aracı Araç Çubuğu – Seçicilerin listesini görüntüler: Cihaz, Sürüm, Tema, düzen yapılandırması ve Eylem Çubuğu ayarları. Tasarım Aracı Araç Çubuğu ayrıca Tema Düzenleyicisi'ni başlatmaya ve Malzeme Tasarım Kılavuzu'nu etkinleştirmeye yönelik simgeler içerir.

• Araç Kutusu – Tasarım Yüzeyi'ne sürükleyip bırakabileceğiniz pencere öğelerinin ve düzenlerin listesini sağlar.

• Özellikler Penceresi – Seçili pencere öğesinin görüntüleme ve düzenleme özelliklerini listeler.

• Belge Ana Hattı – Düzeni oluşturan pencere öğelerinin ağacını görüntüler. Ağaçtaki bir öğeye tıklayarak Tasarım Yüzeyi'nde seçilmesini sağlayabilirsiniz. Ayrıca, ağaçtaki bir öğeye tıklanması, öğenin özelliklerini Özellikler penceresine yükler.

Tasarım Yüzeyi

Tasarım Aracı, pencere öğelerini araç kutusundan Tasarım Yüzeyi'ne sürükleyip bırakmanızı mümkün kılar. Tasarım Aracı pencere öğeleriyle etkileşime geçtiğinizde (yeni pencere öğeleri ekleyerek veya mevcut pencere öğelerini yeniden konumlandırarak), kullanılabilir ekleme noktalarını işaretlemek için dikey ve yatay çizgiler görüntülenir. Aşağıdaki örnekte, Tasarım Yüzeyine yeni Button bir pencere öğesi sürükleniyor:

Ayrıca, pencere öğeleri kopyalanabilir: Bir pencere öğesini kopyalamak için kopyala ve yapıştır'ı kullanabilir veya CTRL tuşuna basarken var olan bir pencere öğesini sürükleyip bırakabilirsiniz.

Tasarım Aracı Araç Çubuğu

Tasarım Aracı Araç Çubuğu (Tasarım Yüzeyi'nin üzerine yerleştirilmiş) yapılandırma seçicileri ve araç menülerini sunar:

Tasarım Aracı Araç Çubuğu aşağıdaki özelliklere erişim sağlar:

• Alternatif Düzen Seçici – Farklı düzen sürümlerinden seçim yapmanızı sağlar.

• Cihaz Seçici – Belirli bir cihazla ilişkilendirilmiş bir niteleyici kümesi (ekran boyutu, çözünürlük ve klavye kullanılabilirliği gibi) tanımlar. Ayrıca yeni cihazlar ekleyebilir ve silebilirsiniz.

• Android Sürüm Seçici – Düzenin hedeflediğini Android sürümü. Tasarım Aracı, düzeni seçili Android sürümüne göre işler.

• Tema Seçici – Düzen için kullanıcı arabirimi temasını seçer.

• Yapılandırma Seçici – Dikey veya yatay gibi cihaz yapılandırmasını seçer.

• Kaynak Niteleyici Seçenekleri – Dil, KULLANıCı Arabirimi Modu, Gece Modu ve Yuvarlak Ekran seçeneklerini seçmek için açılan menüler sunan bir iletişim kutusu açar.

• Eylem Çubuğu Ayarlar – Düzen için Eylem Çubuğu ayarlarını yapılandırılır.

• Tema Düzenleyicisi – Seçili temanın öğelerini özelleştirmenizi sağlayan Tema Düzenleyicisi'ni açar.

• Malzeme Tasarım Kılavuzu – Malzeme Tasarım Kılavuzunu etkinleştirir veya devre dışı bırakır. Malzeme Tasarım Kılavuzu'na bitişik açılan menü öğesi, kılavuzu özelleştirmenizi sağlayan bir iletişim kutusu açar.

Bu özelliklerin her biri şu konularda daha ayrıntılı olarak açıklanmıştır:

• Kaynak Niteleyicileri ve Görselleştirme Seçenekleri, Cihaz Seçici, Android Sürüm Seçici, Tema Seçici, Yapılandırma Seçici, Kaynak Nitelikleri Seçenekleri ve Eylem Çubuğu Ayarlar hakkında ayrıntılı bilgi sağlar.

• Alternatif Düzen Görünümleri, Alternatif Düzen Seçici'nin nasıl kullanılacağını açıklar.

• Xamarin.Android Tasarım Aracı Malzeme Tasarımı Özellikleri, Tema Düzenleyicisi ve Malzeme Tasarım Kılavuzu'na kapsamlı bir genel bakış sağlar.

Bağlam menüsü komutları

Bağlam menüsü hem Tasarım Yüzeyi'nde hem de Belge Ana Hattı'nda kullanılabilir. Bu menü, seçili pencere öğesi ve kapsayıcısı için kullanılabilen komutları görüntüler ve kapsayıcılarda işlem gerçekleştirmenizi kolaylaştırır (Tasarım Yüzeyi'ni seçmek her zaman kolay değildir). Bağlam menüsü örneği aşağıda verilmiştir:

Bu örnekte, bir TextView öğesine sağ tıklanması, çeşitli seçenekler sağlayan bir bağlam menüsü açar:

• LinearLayout – öğesinin üst TextViewöğesini LinearLayout düzenlemek için bir alt menü açar.

• Delete, Copy ve Cut – sağ tıklanan TextViewöğesine uygulanan işlemler.

Yakınlaştırma denetimleri

Tasarım Yüzeyi, gösterildiği gibi çeşitli denetimler aracılığıyla yakınlaştırmayı destekler:

Bu denetimler, Tasarım Aracı kullanıcı arabiriminin belirli alanlarını görmeyi kolaylaştırır:

• Kapsayıcıları Vurgula – Yakınlaştırıp uzaklaştırırken daha kolay bulunabilmesi için Tasarım Yüzeyi'ndeki kapsayıcıları vurgular.

• Normal Boyut : Düzeni piksel olarak işler, böylece düzenin seçilen cihazın çözünürlüğüne nasıl bakacağını görebilirsiniz.

• Pencereye Sığdır – Tasarım Yüzeyinde düzenin tamamının görünür olması için yakınlaştırma düzeyini ayarlar.

• Yakınlaştır – Her tıklamayla artımlı olarak yakınlaştırarak düzeni büyütür.

• Uzaklaştır – Her tıklamayla artımlı olarak uzaklaştırarak tasarım yüzeyinde düzenin daha küçük görünmesini sağlar.

Seçilen yakınlaştırma ayarının çalışma zamanında uygulamanın kullanıcı arabirimini etkilemediğini unutmayın.

Tasarım ve Kaynak bölmeleri arasında geçiş yapma

Tasarım ve Kaynak bölmeleri arasındaki orta şeritte, Tasarım ve Kaynak bölmelerinin görüntülenme biçimini değiştirmek için kullanılan birkaç düğme vardır:

Bu düğmeler aşağıdakileri yapar:

• Tasarım – En üstteki bu düğme olan Tasarım, Tasarım bölmesini seçer. Bu düğmeye tıklandığında Araç Kutusu ve Özellikler bölmeleri etkinleştirilir ve Metin Düzenleyicisi Araç Çubuğu görüntülenmez. Daralt düğmesine tıklandığında (aşağıya bakın), Tasarım bölmesi Kaynak bölmesi olmadan tek başına gösterilir.

• Bölmeleri Değiştir – Bu düğme (iki karşıt oka benzeyen) Tasarım ve Kaynak bölmelerini değiştirerek Kaynak bölmesinin solda ve Tasarım bölmesinin sağda olması sağlanır. Yeniden tıklanması, bu bölmeleri özgün konumlarıyla değiştirir.

• Kaynak – Bu düğme (iki karşıt açılı köşeli ayraç gibi) Kaynak bölmesini seçer. Bu düğmeye tıklandığında Araç Kutusu ve Özellikler bölmeleri devre dışı bırakılır ve Metin Düzenleyicisi Araç Çubuğu Visual Studio'nun en üstünde görünür hale gelir. Daralt düğmesine tıklandığında (aşağıya bakın), Kaynak düğmesine tıklandığında Tasarım bölmesi yerine Kaynak bölmesi görüntülenir.

• Dikey Bölme – Bu düğme (dikey çubuk gibi), Tasarım ve Kaynak bölmelerini yan yana görüntüler. Bu, varsayılan düzenlemedir.

• Yatay Bölme – Bu düğme (yatay bir çubuk gibi), Kaynak bölmesinin üzerindeki Tasarım bölmesini görüntüler. Kaynak bölmesini Tasarım bölmesinin üzerine yerleştirmek için Bölmeleri Değiştir'e tıklanabilir.

• Bölmeyi Daralt – Bu düğme (iki sağ köşeli ayraç gibi) Tasarım ve Kaynak'ın çift bölmeli görünümünü bu bölmelerden birinin tek bir görünümüne "daraltır". Bu düğme, görünümü çift bölmeli (Tasarım ve Kaynak) görüntüleme moduna geri döndürmek için tıklanabilen Bölmeyi Genişlet düğmesine (iki sol köşeli ayraç gibi) dönüşür.

Bölmeyi Daralt'a tıklandığında, yalnızca Tasarım bölmesi görüntülenir. Ancak, bunun yerine yalnızca Kaynak bölmesini görüntülemek için Kaynak düğmesine tıklayabilirsiniz. Tasarım bölmesine dönmek için Tasarım düğmesine yeniden tıklayın.

Kaynak bölmesi

Kaynak bölmesi, Tasarım Yüzeyi'nde gösterilen tasarımın temelini oluşturan XML kaynağını görüntüler. Her iki görünüm de aynı anda kullanılabilir olduğundan, tasarımın görsel gösterimiyle tasarımın temel alınan XML kaynağı arasında gidip gelmek suretiyle bir kullanıcı arabirimi tasarımı oluşturmak mümkündür:

XML kaynağında yapılan değişiklikler Tasarım Yüzeyi'nde hemen işlenir; Tasarım Yüzeyi'nde yapılan değişiklikler, Kaynak bölmesinde görüntülenen XML kaynağının uygun şekilde güncelleştirilmasına neden olur. Kaynak bölmesinde XML'de değişiklik yaptığınızda, xml tabanlı kullanıcı arabirimi geliştirmeyi hızlandırmak için otomatik tamamlama ve IntelliSense özellikleri daha sonra açıklandığı gibi kullanılabilir.

Uzun XML dosyalarıyla çalışırken daha fazla gezinti kolaylığı için, Kaynak bölmesi Visual Studio kaydırma çubuğunu destekler (önceki ekran görüntüsünde sağ tarafta görüldüğü gibi). Kaydırma çubuğu hakkında daha fazla bilgi için bkz . Kaydırma Çubuğunu Özelleştirerek Kodunuzu İzleme.

Otomatik tamamlama

Bir pencere öğesinin özniteliğinin adını yazmaya başladığınızda, olası tamamlamaların listesini görmek için CTRL+ARA ÇUBUĞU tuşlarına basabilirsiniz. Örneğin, aşağıdaki örneği girdikten android:lay sonra (ardından CTRL+ARA ÇUBUĞU yazdıktan sonra), aşağıdaki liste sunulur:

Listelenen ilk tamamlanmayı kabul etmek için ENTER tuşuna basın veya ok tuşlarını kullanarak istediğiniz tamamlamaya gidin ve ENTER tuşuna basın. Alternatif olarak, fareyi kullanarak istediğiniz tamamlamaya gidebilir ve tıklayabilirsiniz.

IntelliSense

Pencere öğesi için yeni bir öznitelik girip bir değer atamaya başladıktan sonra, bir tetikleyici karakteri yazıldıktan sonra IntelliSense açılır ve bu öznitelik için kullanılacak geçerli değerlerin listesini sağlar. Örneğin, aşağıdaki örnekte için ilk çift tırnak girildikten android:layout_width sonra, bu genişlik için geçerli seçeneklerin listesini sağlamak üzere bir otomatik tamamlama seçici açılır:

Bu açılan pencerenin alt kısmında iki düğme bulunur (yukarıdaki ekran görüntüsünde kırmızıyla vurgulandığı gibi). Sol taraftaki Proje Kaynakları düğmesine tıklandığında, liste uygulama projesinin parçası olan kaynaklarla sınırlandırılırken, sağ taraftaki Çerçeve Kaynakları düğmesine tıklandığında, liste çerçeveden kullanılabilir kaynakları görüntüleyecek şekilde kısıtlanmış olur. Bu düğmeler açık veya kapalı: Her birinin sağladığı filtreleme eylemini devre dışı bırakmak için bu düğmelere yeniden tıklayabilirsiniz.

Özellikler bölmesi

Tasarım Aracı, Özellikler bölmesi aracılığıyla pencere öğesi özelliklerinin düzenlenmesini destekler:

Özellikler bölmesinde listelenen özellikler, Tasarım Yüzeyi'nde hangi pencere öğesinin seçili olduğuna bağlı olarak değişir.

Varsayılan değerler

Çoğu pencere öğesinin özellikleri Özellikler penceresinde boş olacaktır çünkü değerleri seçili Android temasından devralınır. Özellikler penceresinde yalnızca seçili pencere öğesi için açıkça ayarlanmış değerler gösterilir; temadan devralınan değerler gösterilmez.

Kaynaklara başvurma

Bazı özellikler, düzen .axml dosyası dışındaki dosyalarda tanımlanan kaynaklara başvurabilir. Bu türdeki en yaygın durumlar ve drawable kaynaklarıdırstring. Ancak başvurular, değerler ve boyutlar gibi Boolean diğer kaynaklar için de kullanılabilir. Bir özellik kaynak başvurularını desteklediğinde, özelliğin metin girişinin yanında bir göz atma simgesi (kare) gösterilir. Bu düğme tıklandığında bir kaynak seçici açar.

Örneğin, aşağıdaki ekran görüntüsü, Özellikler penceresindeki bir Text pencere öğesinin metin alanının sağındaki koyu renkli kareye tıklandığında kullanılabilen seçenekleri gösterir:

Kaynak... öğesine tıklandığında Kaynak Seç iletişim kutusu görüntülenir:

Bu listeden, Özellikler bölmesindeki metni sabit kodlamak yerine bu pencere öğesi için kullanılacak bir metin kaynağı seçebilirsiniz. Sonraki örnekte, özelliğinin ImageViewkaynak seçicisi Src gösterilmektedir:

Özelliğin sağındaki Src boş kareye tıklanması, renklerden (yukarıda gösterildiği gibi) çizilebilir öğelere kadar uzanan kaynakların listesini içeren Kaynak Seç iletişim kutusunu açar.

Boole özelliği başvuruları

Boole özellikleri normalde Özellikler penceresi bir özelliğin yanında onay işaretleri olarak seçilir. true Bu onay kutusunu işaretleyerek veya işaretini kaldırarak bir veya false değeri belirleyebilir veya özelliğin sağındaki koyu dolgulu kareye tıklayarak bir özellik başvurusu seçebilirsiniz. Aşağıdaki örnekte metin, seçili TextViewile ilişkilendirilmiş Tüm Büyük Harf boole özelliği başvurusuna tıklanarak tüm büyük harflere değiştirilir:

Özellikleri satır içi düzenleme

Android Tasarım Aracı, Tasarım Yüzeyi'ndeki belirli özelliklerin doğrudan düzenlenmesini destekler (bu nedenle özellik listesinde bu özellikleri aramanız gerekmez). Doğrudan düzenlenebilen özellikler metin, kenar boşluğu ve boyut içerir.

Metin

Bazı pencere öğelerinin (ve gibi Button TextView) metin özellikleri doğrudan Tasarım Yüzeyinde düzenlenebilir. Bir pencere öğesine çift tıklanması, aşağıda gösterildiği gibi öğeyi düzenleme moduna alır:

Yeni bir metin değeri girebilir veya yeni bir kaynak dizesi girebilirsiniz. Aşağıdaki örnekte, @string/hello kaynak şu metinle CLICK THIS BUTTONdeğiştiriliyor:

Bu değişiklik pencere öğesinin text özelliğinde depolanır; kaynağa atanan @string/hello değeri değiştirmez. Yeni bir metin dizesini tuşladığınızda, girilen metni otomatik olarak yeni bir kaynağa bağlamak için Shift + Enter tuşuna basabilirsiniz.

Marj

Bir pencere öğesi seçtiğinizde, Tasarım Aracı pencere öğesinin boyutunu veya kenar boşluğunu etkileşimli olarak değiştirmenize olanak sağlayan tutamaçlar görüntüler. Pencere öğesi seçiliyken tıklandığında kenar boşluğu düzenleme modu ile boyut düzenleme modu arasında geçiş yapılır.

Bir pencere öğesine ilk kez tıkladığınızda, kenar boşluğu tutamaçları görüntülenir. Fareyi tutamaçlardan birine taşırsanız, Tasarım Aracı tutamacın değiştireceği özelliği görüntüler (özellik için layout_marginLeft aşağıda gösterildiği gibi):

Kenar boşluğu zaten ayarlanmışsa, kenar boşluğunun kaplandığı alanı gösteren noktalı çizgiler görüntülenir:

Size

Daha önce de belirtildiği gibi, zaten seçili olan bir pencere öğesine tıklayarak boyut düzenleme moduna geçebilirsiniz. Belirtilen boyutun wrap_contentboyutunu olarak ayarlamak için üçgen tutamacı tıklatın:

İçeriği Kaydır tutamacını tıklatmak, pencere öğesini bu boyutta küçültür, böylece kapalı içeriği sarmalama gereğinden büyük olmaz. Bu örnekte, düğme metni bir sonraki ekran görüntüsünde gösterildiği gibi yatay olarak küçülür.

Boyut değeri İçeriği Kaydır olarak ayarlandığında, Tasarım Aracı boyutu match_parentolarak değiştirmek için ters yöne işaret eden üçgen bir tutamaç görüntüler:

Üst Öğeyi Eşleştir tutamacını tıklattığınızda boyut, üst pencere öğesiyle aynı olacak şekilde bu boyutta geri yüklenir.

Ayrıca, pencere öğesini rastgele dp bir değere yeniden boyutlandırmak için döngüsel yeniden boyutlandırma tutamacını sürükleyebilirsiniz (yukarıdaki ekran görüntülerinde gösterildiği gibi). Bunu yaptığınızda, bu boyut için hem İçeriği Kaydır hem de Üst Öğeyi Eşleştir tanıtıcıları gösterilir:

Tüm kapsayıcılar bir pencere öğesinin düzenlenmesine Size izin vermez. Örneğin, aşağıdaki LinearLayout seçili ekran görüntüsünde yeniden boyutlandırma tutamaçlarının görünmediğini görebilirsiniz:

Belge Anahattı

Belge Ana Hattı, düzenin pencere öğesi hiyerarşisini görüntüler. Aşağıdaki örnekte, içeren LinearLayout pencere öğesi seçilidir:

Seçili pencere öğesinin ana hattı (bu örnekte, bir LinearLayout) Tasarım Yüzeyi'nde de vurgulanır. Belge Ana Hattı'ndaki seçili pencere öğesi, Tasarım Yüzeyi'ndeki karşılık gelen öğesiyle eşitlenmiş durumda kalır. Bu, Tasarım Yüzeyi'nde her zaman kolay seçilmeyen görünüm gruplarını seçmek için kullanışlıdır.

Belge Ana Hattı kopyalama ve yapıştırmayı destekler veya sürükleyip bırakmayı kullanabilirsiniz. Sürükleyip bırakma, Belge Ana Hattı'ndan Tasarım Yüzeyi'ne ve Tasarım Yüzeyi'nden Belge Ana Hattı'na desteklenir. Ayrıca, Belge Ana Hattı'nda bir öğeye sağ tıklandığında, bu öğenin bağlam menüsü görüntülenir (Tasarım Yüzeyi'nde aynı pencere öğesine sağ tıkladığınızda görüntülenen bağlam menüsü).

Mac için Visual Studio

Tasarım Aracı başlatma

Tasarım Aracı, bir düzen oluşturulduğunda otomatik olarak başlatılır veya mevcut bir .axml dosyasına çift tıklanarak başlatılabilir. Örneğin, Kaynaklar > Düzeni klasöründe Main.axml'ye çift tıklanması, aşağıda gösterildiği gibi Tasarım Aracı yükler:

Benzer şekilde, Çözüm Bölmesi'nde düzen klasörüne sağ tıklayıp Yeni Dosya > Ekle Android > Düzeni'ni seçerek yeni bir düzen ekleyebilirsiniz>:

Bu, yeni bir .axml dosyası oluşturur ve Design Surface'a yükler.

İpucu

Visual Studio'nun daha yeni sürümleri, Android Tasarım Aracı içinde .xml dosyaları açmayı destekler.

Android Tasarım Aracı hem .axml hem de .xml dosyaları desteklenir.

Tasarım Aracı özellikleri

Tasarım Aracı, aşağıdaki ekran görüntüsünde gösterildiği gibi çeşitli özelliklerini destekleyen birkaç bölümden oluşur:

Tasarım Aracı bir düzeni düzenlerken, tasarımınızı oluşturmak ve şekillendirmek için aşağıdaki özellikleri kullanırsınız:

• Tasarım Yüzeyi – Düzenin cihazda nasıl görüneceğine ilişkin düzenlenebilir bir gösterim vererek kullanıcı arabiriminin görsel olarak oluşturulmasını kolaylaştırır.

• Araç Çubuğu – Seçicilerin listesini görüntüler: Cihaz, Sürüm, Tema, düzen yapılandırması ve Eylem Çubuğu ayarları. Araç Çubuğu ayrıca Tema Düzenleyicisi'ni başlatmaya ve Malzeme Tasarım Kılavuzu'nu etkinleştirmeye yönelik simgeler içerir.

• Araç Kutusu – Tasarım Yüzeyi'ne sürükleyip bırakabileceğiniz pencere öğelerinin ve düzenlerin listesini sağlar.

• Özellik Bölmesi : Seçili pencere öğesinin görüntüleme ve düzenleme özelliklerini listeler.

• Belge Ana Hattı – Düzeni oluşturan pencere öğelerinin ağacını görüntüler. Ağaçtaki bir öğeye tıklayarak Tasarım Aracı seçilmesine neden olabilirsiniz. Ayrıca, ağaçtaki bir öğeye tıklanması, öğenin özelliklerini Özellik Bölmesi'ne yükler.

Araç Çubuğu

Araç Çubuğu (Tasarım Yüzeyi'nin üzerine yerleştirilmiş) yapılandırma seçicileri ve araç menülerini sunar:

Araç Çubuğu aşağıdaki özelliklere erişim sağlar:

• Alternatif Düzen Seçici – Farklı düzen sürümlerinden seçim yapmanızı sağlar.

• Cihaz Seçici – Ekran boyutu, çözünürlük ve klavye kullanılabilirliği gibi belirli bir cihazla ilişkilendirilmiş bir niteleyici kümesi tanımlar. Ayrıca yeni cihazlar ekleyebilir ve silebilirsiniz.

• Android Sürüm Seçici – Düzenin hedeflediğini Android sürümü. Tasarım Aracı, düzeni seçili Android sürümüne göre işler.

• Tema Seçici – Düzen için kullanıcı arabirimi temasını seçer.

• Yapılandırma Seçici – Dikey veya yatay gibi cihaz yapılandırmasını seçer.

• Kaynak Niteleyici Seçenekleri – Dil, KULLANıCı Arabirimi Modu, Gece Modu ve Yuvarlak Ekran seçeneklerini seçmek için açılan menüler sunan bir iletişim kutusu açar.

• Eylem Çubuğu Ayarlar – Düzen için Eylem Çubuğu ayarlarını yapılandırılır.

• Tema Düzenleyicisi – Seçili temanın öğelerini özelleştirmenizi sağlayan Tema Düzenleyicisi'ni açar.

• Malzeme Tasarım Kılavuzu – Malzeme Tasarım Kılavuzunu etkinleştirir veya devre dışı bırakır. Malzeme Tasarım Kılavuzu'na bitişik açılan menü öğesi, kılavuzu özelleştirmenizi sağlayan bir iletişim kutusu açar.

Bu özelliklerin her biri şu konularda daha ayrıntılı olarak açıklanmıştır:

Kaynak Niteleyicileri ve Görselleştirme Seçenekleri, Cihaz Seçici, Android Sürüm Seçici, Tema Seçici, Yapılandırma Seçici, Kaynak Nitelikleri Seçenekleri ve Eylem Çubuğu Ayarlar hakkında ayrıntılı bilgi sağlar.

Alternatif Düzen Görünümleri, Alternatif Düzen Seçici'nin nasıl kullanılacağını açıklar.

Malzeme Tasarımı Özellikleri, Tema Düzenleyicisi ve Malzeme Tasarım Kılavuzu'na kapsamlı bir genel bakış sağlar.

Tasarım Yüzeyi

Tasarım Aracı, pencere öğelerini araç kutusundan Design Surface'a sürükleyip bırakmanızı mümkün kılar. Tasarım Aracı pencere öğeleriyle etkileşime geçtiğinizde (yeni pencere öğeleri ekleyerek veya mevcut pencere öğelerini yeniden konumlandırarak), kullanılabilir ekleme noktalarını işaretlemek için dikey ve yatay çizgiler görüntülenir. Aşağıdaki örnekte, Tasarım Yüzeyine yeni Button bir pencere öğesi sürükleniyor:

Ayrıca, pencere öğeleri kopyalanabilir: Kopyalama ve yapıştırma özelliğini kullanarak bir pencere öğesini kopyalayabilir veya Ctrl tuşuna basarken var olan bir pencere öğesini sürükleyip bırakabilirsiniz.

Bağlam menüsü komutları

Bağlam menüsü hem Tasarım Yüzeyi'nde hem de Belge Ana Hattı'nda kullanılabilir. Bu menü, seçili pencere öğesi ve kapsayıcısı için kullanılabilen komutları görüntüler ve kapsayıcılarda işlem gerçekleştirmenizi kolaylaştırır (Tasarım Yüzeyi'ni seçmek her zaman kolay değildir). Bağlam menüsü örneği aşağıda verilmiştir:

Bu örnekte, bir Button öğesine sağ tıklanması, çeşitli seçenekler sağlayan bir bağlam menüsü açar:

• LinearLayout – öğesinin üst Buttonöğesini LinearLayout düzenlemek için bir alt menü açar.

• Kes, Kopyala ve Sil – sağ tıklanan Buttonöğesine uygulanan işlemler.

Yakınlaştırma denetimleri

Tasarım Yüzeyi, gösterildiği gibi çeşitli denetimler aracılığıyla yakınlaştırmayı destekler:

Bu denetimler, Tasarım Aracı kullanıcı arabiriminin belirli alanlarını görmeyi kolaylaştırır:

• Kapsayıcıları Vurgula – Yakınlaştırıp uzaklaştırırken daha kolay bulunabilmesi için Tasarım Yüzeyi'ndeki kapsayıcıları vurgular.

• Normal Boyut : Düzeni piksel olarak işler, böylece düzenin seçilen cihazın çözünürlüğüne nasıl bakacağını görebilirsiniz.

• Pencereye Sığdır – Tasarım Yüzeyinde düzenin tamamının görünür olması için yakınlaştırma düzeyini ayarlar.

• Yakınlaştır – Her tıklamayla artımlı olarak yakınlaştırarak düzeni büyütür.

• Uzaklaştır – Her tıklamayla artımlı olarak uzaklaştırarak tasarım yüzeyinde düzenin daha küçük görünmesini sağlar.

Seçilen yakınlaştırma ayarının çalışma zamanında uygulamanın kullanıcı arabirimini etkilemediğini unutmayın.

Özellik Bölmesi

Tasarım Aracı, Özellik Bölmesi aracılığıyla pencere öğesi özelliklerinin düzenlenmesini destekler. Özellik Bölmesi'nde listelenen özellikler, Tasarım Aracı yüzeyde hangi pencere öğesinin seçili olduğuna bağlı olarak değişir. Button Önceki örnekteki öğesi seçildiğinde, bu pencere öğesinin Button özellikleri gösterilir:

Özellik Bölmesi bölümleri

Özellik Bölmesi, benzer özellikleri birlikte gruplandıran birkaç bölüme ayrılır; bu, ilgi çekici özelliklerin bulunmasını kolaylaştırır:

• Pencere öğesi – Pencere öğesinin , visibility, textvb. gibi idana özellikleri. Pencere öğesinin içeriğini yönetme özellikleri genellikle buraya yerleştirilir.

• Stil : Pencere öğesinin görsel görünümünü değiştiren özellikler, örneğin font, text color, , backgroundvb.

• Düzen : Pencere öğesinin konumunu ve boyutunu ayarlayan özellikler.

• Scroll – Kaydırma özellikleri.

• Davranış : Pencere öğesinin nasıl davranacağını ayarlayan bayraklar.

Varsayılan değerler

Çoğu pencere öğesinin özellikleri, değerleri seçili Android temasından devraldığından Özellik Bölmesi'nde boş olacaktır. Özellik Bölmesi yalnızca seçili pencere öğesi için açıkça ayarlanan değerleri gösterir; temadan devralınan değerleri göstermez.

Kaynaklara başvurma

Bazı özellikler, düzen .axml dosyası dışındaki dosyalarda tanımlanan kaynaklara başvurabilir. Bu türdeki en yaygın durumlar ve drawable kaynaklarıdırstring. Ancak başvurular, değerler ve boyutlar gibi Boolean diğer kaynaklar için de kullanılabilir. Bir özellik kaynak başvurularını desteklediğinde, özelliğin metin girişinin yanında bir göz atma simgesi (üç nokta, ...) gösterilir. Tıklandığında, bu düğme bir kaynak seçici açar.

Örneğin, aşağıdaki ekran görüntüsü, Özellik Bölmesi'ndeki bir Button pencere öğesinin metin alanının sağındaki üç noktaya tıklandığında kullanılabilen kaynakları gösterir:

Sonraki örnekte, özelliğinin ImageViewkaynak seçicisi Src gösterilmektedir:

Boole özelliği başvuruları

Boole özellikleri normalde Özellik Bölmesi'nde onay kutusu olarak gösterilir. Bir Boolean özellik kaynak başvurularını desteklediğinde, özelliğin yanında küçük bir onay kutusu görüntülenir. İşaretli onay kutusu anlamına gelir true ve boş bir kutu anlamına gelir false. Veya gibi true falsebir değeri doğrudan da girebilirsiniz. Farenizi girişin üzerine getirdiğinizde küçük bir metin alanı simgesi açılır. Değeri el ile girmek isterseniz buna tıklayabilirsiniz.

Gruplandırılmış özellikler

Bazı pencere öğelerinin birlikte gruplandırılmış çok değerli özellikleri vardır ( Paddingörneğin, gibi). Bu özellik değerleri Özellik Bölmesi'nde tek, genişletilebilir bir satırda listelenir. Bu özelliklerden bazıları, aşağıda gösterilen özellik gibi doğrudan gruplandırılmış satırda Padding düzenlenebilir:

Özellikleri satır içi düzenleme

Android Tasarım Aracı, Tasarım Yüzeyi'ndeki belirli özelliklerin doğrudan düzenlenmesini destekler (bu nedenle özellik listesinde bu özellikleri aramanız gerekmez). Doğrudan düzenlenebilen özellikler metin, kenar boşluğu ve boyut içerir.

Metin

Bazı pencere öğelerinin (ve gibi Button TextView) metin özellikleri doğrudan Tasarım Yüzeyinde düzenlenebilir. Bir pencere öğesine çift tıklanması, aşağıda gösterildiği gibi öğeyi düzenleme moduna alır:

Yeni bir metin değeri girebilir veya yeni bir kaynak dizesi girebilirsiniz. Aşağıdaki örnekte, @string/hello kaynak şu metinle CLICK THIS BUTTONdeğiştiriliyor:

Bu değişiklik pencere öğesinin text özelliğinde depolanır; kaynağa atanan @string/hello değeri değiştirmez. Yeni bir metin dizesini tuşladığınızda, girilen metni otomatik olarak yeni bir kaynağa bağlamak için Shift + Enter tuşuna basabilirsiniz.

Marj

Bir pencere öğesi seçtiğinizde, Tasarım Aracı pencere öğesinin boyutunu veya kenar boşluğunu etkileşimli olarak değiştirmenize olanak sağlayan tutamaçlar görüntüler. Pencere öğesi seçiliyken tıklandığında kenar boşluğu düzenleme modu ile boyut düzenleme modu arasında geçiş yapılır.

Bir pencere öğesine ilk kez tıkladığınızda, kenar boşluğu tutamaçları görüntülenir. Fareyi tutamaçlardan birine taşırsanız, Tasarım Aracı tutamacın değiştireceği özelliği görüntüler (özellik için layout_marginLeft aşağıda gösterildiği gibi):

Kenar boşluğu zaten ayarlanmışsa, kenar boşluğunun kaplandığı alanı gösteren noktalı çizgiler görüntülenir:

Size

Daha önce de belirtildiği gibi, zaten seçili olan bir pencere öğesine tıklayarak boyut düzenleme moduna geçebilirsiniz. Belirtilen boyutun wrap_contentboyutunu olarak ayarlamak için üçgen tutamacı tıklatın:

İçeriği Kaydır tutamacını tıklatmak, pencere öğesini bu boyutta küçültür, böylece kapalı içeriği kaydırmak için gerekenden büyük değildir. Bu örnekte, düğme metni bir sonraki ekran görüntüsünde gösterildiği gibi yatay olarak küçülür.

Boyut değeri İçeriği Kaydır olarak ayarlandığında, Tasarım Aracı boyutu match_parentolarak değiştirmek için ters yöne işaret eden üçgen bir tutamaç görüntüler:

Üst Öğeyi Eşleştir tutamacını tıklattığınızda boyut, üst pencere öğesiyle aynı olacak şekilde bu boyutta geri yüklenir.

Ayrıca, pencere öğesini rastgele dp bir değere yeniden boyutlandırmak için döngüsel yeniden boyutlandırma tutamacını sürükleyebilirsiniz (yukarıdaki ekran görüntülerinde gösterildiği gibi). Bunu yaptığınızda, bu boyut için hem İçeriği Kaydır hem de Üst Öğeyi Eşleştir tanıtıcıları gösterilir:

Tüm kapsayıcılar bir pencere öğesinin düzenlenmesine Size izin vermez. Örneğin, aşağıdaki LinearLayout seçili ekran görüntüsünde yeniden boyutlandırma tutamaçlarının görünmediğini görebilirsiniz:

Belge Anahattı

Belge Ana Hattı, düzenin pencere öğesi hiyerarşisini görüntüler. Aşağıdaki örnekte, içeren LinearLayout pencere öğesi seçilidir:

Seçili pencere öğesinin ana hattı (bu örnekte, bir LinearLayout) Tasarım Yüzeyi'nde de vurgulanır. Belge Ana Hattı'ndaki seçili pencere öğesi, Tasarım Yüzeyi'ndeki karşılık gelen öğesiyle eşitlenmiş durumda kalır. Bu, Tasarım Yüzeyi'nde her zaman kolay seçilmeyen görünüm gruplarını seçmek için kullanışlıdır.

Belge Ana Hattı kopyalama ve yapıştırmayı destekler veya sürükleyip bırakmayı kullanabilirsiniz. Sürükleyip bırakma, Belge Ana Hattı'ndan Tasarım Yüzeyi'ne ve Tasarım Yüzeyi'nden Belge Ana Hattı'na desteklenir. Ayrıca, Belge Ana Hattı'nda bir öğeye sağ tıklandığında, bu öğenin bağlam menüsü görüntülenir (Tasarım Yüzeyi'nde aynı pencere öğesine sağ tıkladığınızda görüntülenen bağlam menüsü).