Facebook RSS Feed
 

.NET Micro Framework: WPF Uygulamalarında StackPanel Kullanımı

StackPanel, birden çok UIElement nesnesinin altalta yada yanyana dizilmesine olanak sağlar. Dizilen nesneler boyutlarına göre istenilen şekilde hizzalanabilir. Bu özellik sayesinde zengin içerikli WPF uygulamalası geliştirebiliriz. Örnek uygulamamızda birkaç UIElement nesnesini yanyana dizmek üzerinde duracağız.

StackPanel Oluşturmak

Üzerinde duracağımız uygulama ile aşağıdaki yatay ve dikey hizzalanmış görünümleri oluşturacağız.

- -
"Horizontal" Hizzalama "Vertical" Hizzalama

Visual Studio üzerinde yeni bir Micro Framework Window Application oluşturarak işe koyulalım. Resources.resx dosyasına 80x80 piksel boyutlarında hazırladığımız aşağıdaki "Logo80x80.gif" dosyasını ekleyelim.

Logo80x80

StackPanel oluşturmak için projemizin Program.cs dosyasını örnekteki gibi değiştirelim:

Program.cs

using System;
using Microsoft.SPOT;
using Microsoft.SPOT.Presentation;
using Microsoft.SPOT.Presentation.Shapes;
using Microsoft.SPOT.Presentation.Media;
using Microsoft.SPOT.Presentation.Controls;
 
namespace MF_WPF_StackPanel
{
    public class Program : Microsoft.SPOT.Application
    {
        public static void Main()
        {
            Program myApplication = new Program();
            Window mainWindow = myApplication.CreateWindow();
            myApplication.Run(mainWindow);
        }
 
        private Window mainWindow;
 
        public Window CreateWindow()
        {
            // Ekran çözünürlüğünde bir Window objesi oluşturalım:
            mainWindow = new Window();
            mainWindow.Height = SystemMetrics.ScreenHeight;
            mainWindow.Width = SystemMetrics.ScreenWidth;
 
            // Dörtgenlerde kullanılacak renkleri tanımlayalım:
            SolidColorBrush mavi1 = new SolidColorBrush(ColorUtility.ColorFromRGB(80, 80, 255));
            SolidColorBrush mavi2 = new SolidColorBrush(ColorUtility.ColorFromRGB(120, 120, 255));
            Pen siyahCizgi = new Pen(ColorUtility.ColorFromRGB(0, 0, 0));
 
            // Yatay hizzalı StackPanel nesnesi oluşturalım:
            StackPanel stackPanel = new StackPanel(Orientation.Horizontal);
 
            // StackPanel'in pencere içerisindeki hizzalamasını yapalım:
            stackPanel.VerticalAlignment = VerticalAlignment.Center;
            stackPanel.HorizontalAlignment = HorizontalAlignment.Center;
 
            // StackPanel'e eklenecek 3 tane görsel nesne oluşturalım:
            Rectangle dortgen1 = new Rectangle(80, 80); // 80x80 Boyutlarında dörtgen
            dortgen1.Fill = mavi1;                      // Dolgu rengi
            dortgen1.Stroke = siyahCizgi;               // Çerçeve rengi
            dortgen1.SetMargin(5);                      // Kenar boşlukları
 
            Rectangle dortgen2 = new Rectangle(80, 80);
            dortgen2.Fill = mavi2;
            dortgen2.Stroke = siyahCizgi;
            dortgen2.SetMargin(5);
 
            Image resim1 = new Image(Resources.GetBitmap(Resources.BitmapResources.Logo80x80));
            resim1.SetMargin(5);
 
            // Oluşturduğumuz görsel nesneleri StackPanel'in alt elemanları olarak ekleyelim:
            stackPanel.Children.Add(dortgen1);
            stackPanel.Children.Add(dortgen2);
            stackPanel.Children.Add(resim1);
 
            // StackPanel'i ana pencerenin alt elemanı olarak ekleyelim:
            mainWindow.Child = stackPanel;
 
            // Pencereyi görünür yapalım:
            mainWindow.Visibility = Visibility.Visible;
 
            return mainWindow;
        }
    }
}

F5 ile uygulamayı başlattığınızda oluşturduğumuz 3 nesnenin yanyana dizildiğini göreceksiniz. StackPanel'in Orientation özelliğini Vertical yaparak nesneleri altalta hizzalayabiliriz.

Uygulama kodlarını buradan indirebilirsiniz.




 
Hoşgeldiniz!
Son güncelleme: 25.12.2016
-
Yeni Teknik Yazılar
Latte Panda İncelemesi
Turta IoT HAT İncelemesi
USB Gamepad Kullanımı
GPIO Kullanımı
VEML6075 UV Sensör Kullan...
-
İlgili Gruplar
.NET MF ve Gadgeteer FB Grubu
İst. IoT & Wearables Meet-up
-
 

This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.Copyright © 1999 - 2017, Umut Erkal. Bu materyal, "Creative Commons Public Licence" ile sunulmuştur.
Kaynak göstererek ve ücretsiz olarak, aynı şartlar altında paylaşabilir ve kullanabilirsiniz. | Kullanım Sözleşmesi