using MyShopping.Model;

          // Specify the local database connection string.

            string DBConnectionString = "Data Source=isostore:/MyShopping.sdf";

            // Create the database if it does not exist.

            using (DBDataContext db = new DBDataContext(DBConnectionString))

            {

                if (db.DatabaseExists() == false)

                {

                    // Create the local database.

                    db.CreateDatabase();

                    // Save changes to the database.

                    db.SubmitChanges();

                }

            }

            // Create the ViewModel object.

            view = new DBView(DBConnectionString);

            // Query the local database and load observable collections.

            view.LoadCollectionsFromDatabase();

Veri tabanını ve kullanacağımız metotları oluşturduktan sonra bunlar yardımı ile diğer sayfaları(kullanıcı ara yüzlerini)oluşturmaya başlayabiliriz.

Başlangıç Sayfasının Oluşturulması

Start Page ,kullanıcının kolayca menülere ulaşıp işlem yapmasını sağlayan dört adet butondan oluşmaktır.Bunun için Projemize sağ tıklayıp Add-> New Item diyip yeni bir Portrait Page oluşturalım ve StartPage olarak adlandıralım.

StartPage’nin arkaplandaki resmini oluşturmak için aşağıdaki brush işlemlerini yapalım diğer sayfaların arka planının resimle doldurulması da aynı şekildedir.

Sayfaya Toolbox alanından  dört adet buton ekleyerek,butonların görsel bir içerik ifade etmesi için her bir butona aşağıdaki background(arka plan) kodlamasını yerleştirelim.

<Button Content="" Height="175" HorizontalAlignment="Left" Margin="228,90,0,0" Name="button2" VerticalAlignment="Top" Width="193" Click="button2_Click">

                <Button.Background>

                    <ImageBrush x:Name="storeImage" ImageSource="Images\store2.jpg" Stretch="Fill"/>

                </Button.Background>

                </Button>

Böylece Visual Studio içinde oluşturduğumuz Images klasörüne  istediğimiz resmi ekleyip yolunu belirterek buton backgroundu yapabiliriz. TilePanel ve Application Tile başlığımızı da içeriğe uygun bir şekilde değiştirerek sayfamızın görsel kısmını tamamlamış oluyoruz.

StartPage.xaml.cs de ise sadece butonlara tıklandığında hangi sayfalara navigate(hareket) edeceğimizi butonların click eventlerine yazalım.

private void button1_Click(object sender, RoutedEventArgs e)

        {

            NavigationService.Navigate(new Uri("/MainPage.xaml", UriKind.Relative));

        }

        private void button2_Click(object sender, RoutedEventArgs e)

        {

            NavigationService.Navigate(new Uri("/StorePage.xaml", UriKind.Relative));

        }

        private void button3_Click(object sender, RoutedEventArgs e)

        {

            NavigationService.Navigate(new Uri("/PanoramaLists.xaml", UriKind.Relative));

        }

        private void button4_Click(object sender, RoutedEventArgs e)

        {

            NavigationService.Navigate(new Uri("/ChanceProductPage.xaml", UriKind.Relative));

        }

oluşturduğumuz başlangıç sayfası ve app.xaml.cs sınıflarına buradan ulaşabilirsiniz.