Beginners request on a data template

[Olivier]

I am new to development and Windows phone.  I am currently building a simple application using a panorama template.

I have a list of items displayed on the screen and I want to set up the target page using this list of items.  I created a new "LineFive" in the following code to use as a parameter in the MainPage.xaml.cs and added in the MainViewModel.cs the value for LineFive.  Unfoirtunately I always get an error.  How can I parameterize the target page I want to use ??? 

Thanks a lot for help

<ListBox x:Name="SecondListBox" Margin="0,0,-12,0" ItemsSource="{Binding Items}">

<ListBox.ItemTemplate>

<DataTemplate>

<StackPanel Margin="0,0,0,17">

<TextBlock Text="{Binding LineThree}" TextWrapping="NoWrap" Margin="12,0,0,0" Style="{StaticResource PhoneTextExtraLargeStyle}" Tap="{Binding LineFive} PARAMETER FROM THE BINDING LIST - this doesn't work" />

</StackPanel>

</DataTemplate>

</ListBox.ItemTemplate>

</ListBox>

[Kiril Stanoev]

Hi Oliver,

 Thank you for contacting us. In this case you will have to used the Tag property since Tap is an event, not a property. I've prepared a small application demonstrating one way to achieve your scenario. Give it a try and let me know if you find anything unclear. I'd be glad to further assist you.

Greetings,
Kiril Stanoev
the Telerik team

[Olivier]

Hi Kiril,

Thanks for your help.  Unfortunately this still does not work ... although I go a step further :)
I attached the application.  When I run it, going to the second panorama (Composition Tips) and selecting Rule of Thirds I still get an error :

Error 3 The process cannot access the file because it is being used by another process.
  0 0 

My you help again ?

Thanks a lot

Olivier

MainViewModel.cs

using System;
using System.ComponentModel;
using System.Collections.Generic;
using System.Diagnostics;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Shapes;
using System.Collections.ObjectModel;

namespace PhotoPoseTip
{
    public class MainViewModel : INotifyPropertyChanged
    {
        public MainViewModel()
        {
            this.Items = new ObservableCollection<ItemViewModel>();
        }

        /// <summary>
        /// A collection for ItemViewModel objects.
        /// </summary>
        public ObservableCollection<ItemViewModel> Items { get; private set; }

        private string _sampleProperty = "Sample Runtime Property Value";
        /// <summary>
        /// Sample ViewModel property; this property is used in the view to display its value using a Binding
        /// </summary>
        /// <returns></returns>
        public string SampleProperty
        {
            get
            {
                return _sampleProperty;
            }
            set
            {
                if (value != _sampleProperty)
                {
                    _sampleProperty = value;
                    NotifyPropertyChanged("SampleProperty");
                }
            }
        }

        public bool IsDataLoaded
        {
            get;
            private set;
        }

        /// <summary>
        /// Creates and adds a few ItemViewModel objects into the Items collection.
        /// </summary>
        public void LoadData()
        {
            // Sample data; replace with real data
            this.Items.Add(new ItemViewModel() { LineOne = "Woman", LineTwo = "Woman Poses examples and directions", LineThree = "Rule of thirds", LineFour = "Digital Zoom", LineFive = "RuleofThirds" });
            this.Items.Add(new ItemViewModel() { LineOne = "Man", LineTwo = "Man Poses examples and directions", LineThree = "Leading Lines", LineFour = "Keep Lens Clean", LineFive = " " });
            this.Items.Add(new ItemViewModel() { LineOne = "Child", LineTwo = "Child Poses examples and directions", LineThree = "Background", LineFour = "Keep Still", LineFive = " " });
            this.Items.Add(new ItemViewModel() { LineOne = "Group", LineTwo = "Group Poses examples and directions", LineThree = "Depth", LineFour = "Shield the Lens", LineFive = " " });
            this.Items.Add(new ItemViewModel() { LineOne = "Wedding", LineTwo = "Soon To Come ...", LineThree = " ", LineFour = " ", LineFive = " "});

            this.IsDataLoaded = true;
        }

        public event PropertyChangedEventHandler PropertyChanged;
        private void NotifyPropertyChanged(String propertyName)
        {
            PropertyChangedEventHandler handler = PropertyChanged;
            if (null != handler)
            {
                handler(this, new PropertyChangedEventArgs(propertyName));
            }
        }
    }
}

MainPage.xaml

<phone:PhoneApplicationPage
    x:Class="PhotoPoseTip.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:controls="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone.Controls"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="696"
    d:DataContext="{d:DesignData SampleData/MainViewModelSampleData.xaml}"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait"  Orientation="Portrait"
    shell:SystemTray.IsVisible="True">

    <!--LayoutRoot is the root grid where all page content is placed-->
    <Grid x:Name="LayoutRoot" Background="Transparent">

    <!--Pivot Control-->
    <controls:Pivot Title="Photography Poses & Tips">
            <!--Pivot menu-->
            <controls:PivotItem Header="menu">
                <ListBox Margin="14,0,-12,0" FontSize="{StaticResource PhoneFontSizeExtraLarge}" FontFamily="{StaticResource PhoneFontFamilySemiLight}">
                    <ListBoxItem Content="About" Tap="GoToAbout"/>
                </ListBox>
            </controls:PivotItem>
      <!--Pivot item one-->
      <controls:PivotItem Header="Portrait Poses">
        <!--Double line list with text wrapping-->
        <ListBox x:Name="FirstListBox" Margin="0,0,-12,0" ItemsSource="{Binding Items}">
          <ListBox.ItemTemplate>
            <DataTemplate>
              <StackPanel Margin="0,0,0,17" Width="432">
                <TextBlock Text="{Binding LineOne}" TextWrapping="Wrap" Style="{StaticResource PhoneTextExtraLargeStyle}" Tap="GoToMen"/>
                <TextBlock Text="{Binding LineTwo}" TextWrapping="Wrap" Margin="12,-6,12,0" Style="{StaticResource PhoneTextSubtleStyle}"/>
              </StackPanel>
            </DataTemplate>
          </ListBox.ItemTemplate>
        </ListBox>
      </controls:PivotItem>

      <!--Pivot item two-->
      <controls:PivotItem Header="Composition Tips">
        <!--Triple line list no text wrapping-->
        <ListBox x:Name="SecondListBox" Margin="0,0,-12,0" ItemsSource="{Binding Items}">
          <ListBox.ItemTemplate>
            <DataTemplate>
              <StackPanel Margin="0,0,0,17">
                                <TextBlock Text="{Binding LineThree}" TextWrapping="NoWrap" Margin="12,0,0,0" Style="{StaticResource PhoneTextExtraLargeStyle}"  Tap="Tips_Tap" Tag="{Binding LineFive}" />
                </StackPanel>
            </DataTemplate>
          </ListBox.ItemTemplate>
        </ListBox>
      </controls:PivotItem>


      <!--Pivot item three-->
      <controls:PivotItem Header="PhoneCam Tips">
        <!--Triple line list no text wrapping-->
        <ListBox x:Name="ThirdListBox" Margin="0,0,-12,0" ItemsSource="{Binding Items}">
          <ListBox.ItemTemplate>
            <DataTemplate>
              <StackPanel Margin="0,0,0,17">
                <TextBlock Text="{Binding LineFour}" TextWrapping="NoWrap" Margin="12,0,0,0" Style="{StaticResource PhoneTextExtraLargeStyle}"/>
                </StackPanel>
            </DataTemplate>
          </ListBox.ItemTemplate>
        </ListBox>
      </controls:PivotItem>
        </controls:Pivot>
    </Grid>

    <!--Sample code showing usage of ApplicationBar-->
    <phone:PhoneApplicationPage.ApplicationBar>
        <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
            <shell:ApplicationBarIconButton IconUri="/Images/appbar_button1.png" Text="Button 1"/>
            <shell:ApplicationBarIconButton IconUri="/Images/appbar_button2.png" Text="Button 2"/>
            <shell:ApplicationBar.MenuItems>
                <shell:ApplicationBarMenuItem Text="MenuItem 1"/>
                <shell:ApplicationBarMenuItem Text="MenuItem 2"/>
            </shell:ApplicationBar.MenuItems>
        </shell:ApplicationBar>
    </phone:PhoneApplicationPage.ApplicationBar>

</phone:PhoneApplicationPage>

 

MainPage.xaml.cs

 

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using Microsoft.Phone.Controls;

namespace PhotoPoseTip
{
    public partial class MainPage : PhoneApplicationPage
    {
        // Constructor
        public MainPage()
        {
            InitializeComponent();

            // Set the data context of the listbox control to the sample data
            DataContext = App.ViewModel;
            this.Loaded += new RoutedEventHandler(MainPage_Loaded);

            //Shows the trial reminder message, according to the settings of the TrialReminder.
            (App.Current as App).trialReminder.Notify();

            //Shows the rate reminder message, according to the settings of the RateReminder.
            (App.Current as App).rateReminder.Notify();
        }


        void MainPage_Loaded(object sender, RoutedEventArgs e)
        {
            if (!App.ViewModel.IsDataLoaded)
            {
                App.ViewModel.LoadData();
            }
        }

        /// <summary>
        /// Navigates to pages.
        /// </summary>
        private void GoToAbout(object sender, GestureEventArgs e)
        {
            this.NavigationService.Navigate(new Uri("/About.xaml", UriKind.RelativeOrAbsolute));
        }
        private void GoToMen(object sender, GestureEventArgs e)
        {
            this.NavigationService.Navigate(new Uri("/RadControlsItem1.xaml", UriKind.RelativeOrAbsolute));
        }

        private void Tips(object sender, GestureEventArgs e)
        {
            this.NavigationService.Navigate(new Uri("/RuleofThirds.xaml", UriKind.RelativeOrAbsolute));
        }

         private void Tips_Tap(object sender, GestureEventArgs e)
        {
            FrameworkElement tappedObject = e.OriginalSource as FrameworkElement;
            if (tappedObject != null)
            {
                string navigateTo = tappedObject.Tag.ToString();
                this.NavigationService.Navigate(new Uri(string.Format("/Views/{0}", navigateTo), UriKind.Relative));
            }
        }

    }
}

Ruleofthirds.xaml

<phone:PhoneApplicationPage
    x:Class="PhotoPoseTip.ViewModels.Page1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait" Orientation="Portrait"
    mc:Ignorable="d" d:DesignHeight="696" d:DesignWidth="480"
    shell:SystemTray.IsVisible="True" Loaded="PhoneApplicationPage_Loaded">

    <!--LayoutRoot is the root grid where all page content is placed-->
    <Grid x:Name="LayoutRoot" Background="Transparent">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <!--TitlePanel contains the name of the application and page title-->
        <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
            <TextBlock x:Name="ApplicationTitle" Text="Photography Poses & Tips" Style="{StaticResource PhoneTextNormalStyle}"/>
            <TextBlock x:Name="PageTitle" Text="Rule of thirds" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
        </StackPanel>

        <!--ContentPanel - place additional content here-->
        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <TextBlock Height="504" HorizontalAlignment="Left" Margin="12,6,5,0" Name="textBlock1" Text=" Imagine that your image is divided into 9 equal segments by 2 vertical and 2 horizontal lines. The rule of thirds says that you should position the most important elements in your scene along these lines, or at the points where they intersect." VerticalAlignment="Top" Width="438" TextWrapping="Wrap" Padding="5" />
            <Image Height="294" HorizontalAlignment="Left" Margin="101,216,0,0" Name="image1" Stretch="Fill" VerticalAlignment="Top" Width="230" Source="/PhotoPoseTip;component/Images/fig0703.png" />
        </Grid>
    </Grid>

    <!--Sample code showing usage of ApplicationBar-->
    <phone:PhoneApplicationPage.ApplicationBar>
        <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
            <shell:ApplicationBarIconButton IconUri="/Images/appbar_button1.png" Text="Button 1"/>
            <shell:ApplicationBarIconButton IconUri="/Images/appbar_button2.png" Text="Button 2"/>
            <shell:ApplicationBar.MenuItems>
                <shell:ApplicationBarMenuItem Text="MenuItem 1"/>
                <shell:ApplicationBarMenuItem Text="MenuItem 2"/>
            </shell:ApplicationBar.MenuItems>
        </shell:ApplicationBar>
    </phone:PhoneApplicationPage.ApplicationBar>

</phone:PhoneApplicationPage>

Ruleofthirds.xaml.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using Microsoft.Phone.Controls;

namespace PhotoPoseTip.ViewModels
{
public partial class Page1 : PhoneApplicationPage
{
public Page1()
{
InitializeComponent();
}

private void PhoneApplicationPage_Loaded(object sender, RoutedEventArgs e)
{

}
}
}

[Kiril Stanoev]

Hi Oliver,

I updated my previously attached app with the code you shared and with little modifications I ran it without any issues (besides some missing pages - RadControlsItem1.xaml, Page1.xaml etc). What I want to say is that I was not able to reproduce the error The process cannot access the file because it is being used by another process.  Could you please take a look at the attached project and let me know if you find anything unclear. I'd be glad to further assist you. 

Greetings,
Kiril Stanoev
the Telerik team

[Olivier]

Thanks Kiril.  This yet does not work (I exit the application without any error or anything ... just exit).  Unfortunately I cannot send you a zip file with my project.  I'll try to find another solution
Olivier

[Lancelot]

Hi Oliver,

I have experienced this before and it is usually a problem related to the developer environment. Files that the project depended on (Images, video, and other assets) were opened or being used by another program. I would usually have Photoshop, Blend, Visual Studio, and many other open tools that have worked on the app files at some point.

Even after closing every other program, it didn't complete solve the issues. However, after a system restart and only opening the solution in Visual Studio, the app ran fine. I would suggest giving this a shot before scrapping the work you've done thus far.

Good Luck,
Lancelot

[Olivier]

Hi,

I tried to run the application code you send me and I got thr following error :

The thread '<No Name>' (0xfbe0052) has exited with code 0 (0x0).

Would you mind explain it ?

Thanks

[Deyan]

Hello Olivier,

This is not an error, this is a message from Visual Studio that a thread execution has ended with the given result.

Greetings,
Deyan
the Telerik team

[Olivier]

Thanks for your help Deyan and mostly Kirik :)  Got it solved !