Full width home advertisement

SQL

ASP.NET

Post Page Advertisement [Top]


    MainPage.xaml sayfası bizim kullanıcıya alışveriş listesi ekleme,silme ve eklenen alışveriş listeleri listeleme imkanı sunabildiğimiz bir sayfadır.


     Bu sayfayı oluşturmak için ApplicationBarIcon butonlarından da faydalanacağız bu butonları kullanarak yeni sayfa oluşturduğumuzda default olarak yorum halinde olan ve aşağıda gösterilen alanı, yorum olmaktan çıkararak erişebiliriz.



Öncelikle yukarıda belirtilen kodları seçip kırmızı kutu içine alınan kısmı
“Uncomment the selected lines” butonuna tıklayarak bu alanı kullanabilir hale geliriz. Bu
işlemi tamamladıktan sonra aşağıdaki şekilde kodlamamızı yaparak Add new list ve Showlists
uygulama butonlarını oluşturalım yine bu buton resimlerini yolunu vererek kendi seçtiğimiz
resimlerden oluşturabileceğimiz gibi


C:\Program Files (x86)\Microsoft SDKs\Windows Phone\v7.1\Icons\dark ya da
C:\Program Files (x86)\Microsoft SDKs\Windows Phone\v7.1\Icons\light yolu altında 

bulunan varolan ikon resimlerini kullanabiliriz.




<phone:PhoneApplicationPage.ApplicationBar>
        <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
            <shell:ApplicationBarIconButton
                IconUri="Icons/add2.png"
                Text="add"
                x:Name="newListAddBarButton"
               Click="newListAddBarButton_Click"/>
            <shell:ApplicationBarIconButton
                IconUri="Icons/show2.png"
                Text="show"
                x:Name="ShowMyListBarButton"
              Click="ShowMyListBarButton_Click"/>
           
         

        </shell:ApplicationBar>
    </phone:PhoneApplicationPage.ApplicationBar>






ApplicationBarIcon butonlarımızı oluşturduğumuza göre veri tabanı ile ilişkilendirip veri
tabanında yer alan bilgileri listeleyebilmemiz için bir ListBox oluşturalım ve Itemsource’ ini
ProductLists ile ilişkilendirelim.


ItemsSource="{Binding ProductLists}"

ListBox’ ı oluşturmadan önce veri tabanından gelecek verilerin hangi şablonda olacağını
belirleyelim. Bunun için aşağıdaki şekilde bir DataTemplate oluşturalım:


<phone:PhoneApplicationPage.Resources>
        <DataTemplate x:Key="ListItemTemplate">

            <Grid HorizontalAlignment="Stretch" Width="420">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="100" />
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition Width="100" />
                </Grid.ColumnDefinitions>

                <CheckBox
                    IsChecked="{Binding Checked, Mode=TwoWay}"
                    Grid.Column="0" VerticalAlignment="Top"/>


                <TextBlock
                    Text="{Binding Name}"
                    FontSize="{StaticResource PhoneFontSizeLarge}"
                    Grid.Column="1" Grid.ColumnSpan="2"
                    VerticalAlignment="Top" Margin="-36, 12, 0, 0"/>

                <Button                               
                    Grid.Column="3"
                    x:Name="BtnDeleteList"
                    BorderThickness="0"                                                                 
                    Margin="0, -18, 0, 0"
                    Click="BtnDeleteList_Click">

                    <Image
                    Source="Icons/appbar.delete.rest1.png"
                    Height="75"
                    Width="75"/>

                </Button>
            </Grid>
        </DataTemplate>
    </phone:PhoneApplicationPage.Resources>

Bundan sonraki sayfalarda yapacağımız Binding işlemleri de benzer şekilde olacaktır
,görüldüğü gibi verilerimizin önce bir checkbox , daha sonra listenin ismini gösteren
(<TextBlock   Text="{Binding Name}"  ile gösterebilen ) bir textblock, bir delete butonu ile
devam etmesini sağladık.


Data templateyi oluşturduktan sonra  ListBox kodlaması yapalım:

<ListBox
                        x:Name="allListItemsListBox"
                        ItemsSource="{Binding ProductLists}"
                        Margin="12,0,4,0" Width="440"
                        ItemTemplate="{StaticResource ListItemTemplate}" Grid.ColumnSpan="2" />


Böylelikle veri tabanımız ile Kontrol elemanları ListBox vb.’ ini ilişkilendirerek(Binding
işlemi ile) verilerimizi sunabiliriz. Bu işlemi çoğu sayfada kullanacağız ve hepsinde de
ListBox kontrolünü tercih edeceğiz çünkü alışveriş listesi bir listelendirme gerektirmekte,
ürünler olsun alış-veriş listesi olsun hepsi liste halinde kullanıcıya sunulmaktadır.
MainPage.xaml.cs kısmında ise aşağıdaki işlemleri yapmalıyız:
İlk olarak kullanıcının yeni liste ekle ApplicationBar butonuna tıkladığında NewListPage ye
gitmesi için aşağıdaki kodlamayı yapalım. Bu arada ApplicationBarIcon butonların Click
eventine ulaşmak için şunları yaparız:
Xaml tarafında butonla ilgili kısma Click yazdığımızda otomatik olarak bize New Event
Handler oluşturacaktır.


Click alanına gelip enter tuşuna bastığımızda aşağıdaki görünüm karşımıza çıkacaktır.

Bu aşamadayken tab tuşuna bastığımızda .xaml.cs taraında click event metodu bizim için
oluşturulmuş olacaktır. XAML tarafında butonların click event’ ine ulaşmak genel olarak bu
şekildedir. Click event’ e ulaştıktan sonra NewList butonumuz için aşağıdaki yönlendirmeyi
yapalım:



private void newListAddBarButton_Click(object sender, EventArgs e)
        {
            NavigationService.Navigate(new Uri("/NewListPage.xaml", UriKind.Relative));
        }

Var olan listelerin gösterilmesi için oluşturduğumuz AppBarIcon butonu ShowList için ise:

  public void ShowMyListBarButton_Click(object sender, EventArgs e)
        {
           NavigationService.Navigate(new Uri("/PanoramaLists.xaml", UriKind.Relative));
        }




Var olan listelerin gösterilmesi için oluşturduğumuz AppBarIcon butonu ShowList için ise:
Böylece kullanıcı hangi listeleri görmek istediğini seçmek için seçim yapabileceği (checkbox
işaretli ise liste gösterilir.) sayfaya yani PanoramaLists sayfasına götürülür.

Alışveriş listelerini silmek için kullanacağımız DeleteList butonu veri tabanında yarattığımız
DeleteList metodunu kullanarak seçilen listeyi siler bu listeyi silerken liste içinde bulunan
ürünlerde silineceğinden silmeden önce kullanıcıya bir uyarı sunulur.


private void BtnDeleteList_Click(object sender, RoutedEventArgs e)
        {
            var button = sender as Button;
            if (MessageBox.Show(string.Format("All products of this shop list will delete.Are you sure ?"), "Confirm Delete", MessageBoxButton.OKCancel) == MessageBoxResult.OK)
            {
                if (button != null)
                {
                    TList ListForDelete = button.DataContext as TList;

                    //Eğer liste silinirse listeye ait tüm ürünleri de sil.
                    foreach (TProduct deleteProduct in App.View.DBShop.Products)
                    {
                        if (ListForDelete.Id == deleteProduct._PListId)
                            App.View.DeleteProduct(deleteProduct);
                    }

                    App.View.DeleteList(ListForDelete);
                }
            }
            this.Focus();
        }

Sender parametresi ile alışveriş listelerinin bulunduğu listede hangi listenin delete butonuna
tıklanmış ise o liste seçilip silinebilir.


protected override void OnNavigatedFrom(System.Windows.Navigation.NavigationEventArgs e)
        {
            // Save changes to the database.
            App.View.SaveChangesToDB();
        }

Son olarark On NavigatedFrom() metodu ile yaptığımız değişiklikleri (veri ekleme, silme)
veri tabanına yansıtmış oluruz.

Uzun bir makale olduğunun farkındayım,son olarak uygulama koduna burdan erişebilirsiniz,iyi çalışmalar.



Hiç yorum yok:

Yorum Gönder

Bottom Ad [Post Page]