Silverlight ile Fırsat Sitesi Yapalım -15(Ürünler sayfasının tasarlanması ve parametrelerin alınıp işlenmesi))

    Ürünler sayfasında tasarım açısından sayfanın üstündeki stcak panel ürün bedenine göre sıralama,fiyat aralığına göre sıralama ve marka logosu gibi bölümler için ayrılmıştır.Ana kısmı ise ürün resmi fiyatı ve indirimli fiyatı,ürün detay butonu gibi elementlerden oluşur.tasarımın oluşturtmasında dikkat edilirse  üç içerik yan yana ve bu alan dolarsa bir alt satıra ürünler yerleştirilmiştir bunun için Silverlight’in toolkit eklentisi VS ‘ya import edilip WrapPanel kullanılmıştır.

ScrolViewer içinde bir wrappanel ve onun içinde de bir UserConrtol bulunmaktadır.

         

Ürünler sayfasına iki parametre iletilir.Bu parametreler aşağıdaki metot içerisinde QueryStringden alınıp işlenir.

protected override void OnNavigatedTo(NavigationEventArgs e)

        {

            int foo;

            int.TryParse(NavigationContext.QueryString["kategoriid"], out foo);

            int foo1;

            int.TryParse(NavigationContext.QueryString["markaIDx"], out foo1);

            kategoriidvalue = foo;

            markaidvalue = foo1;

            webservis.UrunleriGetirAsync(kategoriidvalue);

            webservis.UrunleriGetirCompleted += new EventHandler<UrunleriGetirCompletedEventArgs>(webservis_UrunleriGetirCompleted);

        }

  void webservis_UrunleriGetirCompleted(object sender, UrunleriGetirCompletedEventArgs e)

        {

            this.MarkalarS.ItemsSource = e.Result;

        }

Ürünler için Veri tabanı bağlantılarının kodlanması, Veri tabanındaki veriler ile ilgli alanların Bind edilmesine bakarsak;

Web Servis:

    [OperationContract]

        List<Urunler> UrunleriGetir(int kategoriId);

       public List<Urunler> UrunleriGetir(int kategoriId)

        {

            var kategoriurunleri = from kategori in veri.MarkaKategorileris join urunler in veri.Urunlers on kategori.KategoriID equals urunler.UKategoriID where urunler.UKategoriID == kategoriId select urunler;

            return kategoriurunleri.ToList<Urunler>();

        }

XAML:

<ScrollViewer VerticalScrollBarVisibility="Auto" Height="384">

<ItemsControl x:Name="MarkalarS" Background="Black">

<ItemsControl.ItemsPanel>

<ItemsPanelTemplate>

<toolkit:WrapPanel Margin="0,0,0,0" Width="900" Height="auto" ScrollViewer.VerticalScrollBarVisibility="auto" ScrollViewer.HorizontalScrollBarVisibility="Visible"/>

</ItemsPanelTemplate>

</ItemsControl.ItemsPanel>

<ItemsControl.ItemTemplate>

<DataTemplate>

<StackPanel>

<Image Source="{Binding UrunResmi}" Width="276" Height="383"/>

<TextBlock Text="{Binding UrunFiyat}" ></TextBlock>

<TextBlock Text="{Binding UrunIndirimliFiyatı}"></TextBlock>

<Button x:Name="buton1" Width="100"/>

<Button Width="70" Content="Ürün Detayları"></Button>

</StackPanel>

</DataTemplate>

</ItemsControl.ItemTemplate>

</ItemsControl>

</ScrollViewer>

Ürünler sayfasında User Controllere erişim ve navigate;

Ürünler sayfasında ilgili ürünler ve fiyat vb. bilgileri listelendi , istediğimiz ürünün detayını görmek için ürün detay butonuna ulaşmak gerekir bunun için daha önceden user controllere ulaşırken  kullandığımız yöntemi kullanacağız.

void MarkalarS_MouseEnter(object sender, MouseEventArgs e)

        {

            ItemsPresenter itemsPresenter = VisualTreeHelper.GetChild(this.MarkalarS, 0) as ItemsPresenter;

            Panel standartPanel = VisualTreeHelper.GetChild(itemsPresenter, 0) as Panel;

            foreach (ContentPresenter contentPresenter in standartPanel.Children)

            {

                StackPanel myStackPanel = VisualTreeHelper.GetChild(contentPresenter, 0) as StackPanel;

                Button myButton = myStackPanel.Children.ElementAt(4) as Button;

                myButton.Click += new RoutedEventHandler(myButton_Click);

               

            }

        }

Ve ilgili butona tıklandığında butonun click eventi aşagıdaki gibi olacaktır:

  void myButton_Click(object sender, RoutedEventArgs e)

        {

            this.frame5.Navigate(new Uri("/UrunDetaysayfası.xaml?urunid", UriKind.Relative));

        }

       Görüldüğü gibi sayfalar oluşturulurken temel alınan mantık once tasarımın oluşturulması sonra very tabanında web servis üzerine ilgili sorgu cümleciklerinin yazılarak belirlenen verilerin çekilmesi ,daha sonra bu verilerin VS tarafında istenilen kontrollere aktarılarak ekranda gösterilmesinden oluşur,ayrıca control elemanlarına erişip(buton vb.) buradan bir başka işlemi gerçekleştirebilmek(bir başka sayfaya hareket gibi.) oldukça önemlidir.