Извлечение изображений из XML с использованием строки запроса

Question

Я использовал LINQ для анализа изображений из XML на одной странице. Я хочу отображать только одно изображение, когда пользователь нажимает на определенную кнопку. Проблема в том, что в списке отображается все изображения в XML-файле вместо того, который я хочу показать. Как использовать NavigationContext.QueryString для отображения только изображения, связанного с определенной кнопкой? Я пробовал, но все равно показывает несколько картинок.

Вот пример файла XML:

<?xml version="1.0" encoding="utf-8" ?>
    <Exercises>
       <Exercise name = "Exercise 1">
         <image>/Images/BeginnerEX/ex1.jpg</image>
         <audio>/Audio/ex1.mp3</audio>
       </Exercise>
       <Exercise name = "Exercise 2">
         <image>/Images/BeginnerEX/ex2.jpg</image>
         <audio>"/Audio/ex2.mp3"</audio>
       </Exercise>
       <Exercise name = "Exercise 3">
         <image>/Images/BeginnerEX/ex3.jpg</image>
         <audio>"/Audio/ex3.mp3"</audio>
       </Exercise>
  </Exercises>

Событие нажатия кнопки:

 private void begButton1_Click(object sender, RoutedEventArgs e)
    {
        string name = "Exercise 1";
        NavigationService.Navigate(new Uri(string.Format("/BeginnerExercisePage.xaml?Exercise={0}", name), UriKind.Relative));

    }

Страница, на которой я хочу показать одну картинку:

public partial class BeginnerExercisePage : PhoneApplicationPage
{
    public BeginnerExercisePage()
    {
        InitializeComponent();

        XDocument beginnerExerciseData = XDocument.Load("BeginnerXML.xml");

        var data = from query in beginnerExerciseData.Descendants("Exercise")
                   select new Exercise
                   {
                       ExImage = (string)query.Element("image"),
                       ExAudio = (string)query.Element("audio")

                   };
        lbBegExPage.ItemsSource = data;

    }

    public class Exercise
    {
        string image;
        string audio;

        public string ExAudio
        {
            get { return audio; }
            set { audio = value; }

        }

        public string ExImage
        {
            get { return image; }
            set { image = value; }

        }

    }

    protected override void OnNavigatedTo(NavigationEventArgs e)
    {
        base.OnNavigatedTo(e);

        string name = string.Empty;
        if (NavigationContext.QueryString.TryGetValue("name", out name))
        {
            this.lbBegExPage.ItemsSource = name;
        }


    }
}

XAML: `Вот XAML:

<!--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="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}"/>
        <TextBlock x:Name="PageTitle" Text="page name" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
    </StackPanel>

    <!--ContentPanel - place additional content here-->
    <StackPanel  x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0" Orientation="Horizontal">
        <ListBox x:Name="lbBegExPage">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel Margin="10">
                         <Image Source="{Binding ExImage}" />
                    </StackPanel>
                </DataTemplate>
             </ListBox.ItemTemplate>    
        </ListBox>
    </StackPanel>
</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>-->

`

Answer 1

Какой у тебя XAML?Я предполагаю, что у вас есть изображение в шаблоне данных ListBox (lbBegExPage).Вы, вероятно, должны иметь его вне ListBox и установить его свойство Source равным {Binding SelectedItem.ExImage, ElementName = lbBegExPage}

Извините, я неправильно понял ваше намерение.Предполагая, что ваша стартовая страница имеет всего 3 жестко закодированных кнопки, которые передают название упражнения по навигации на вторую страницу - вам следует изменить свой BeginerExercisePage.Удалите весь код данных из конструктора и в переопределении OnNavigatedTo выполните:

    var exercise = (from ex in beginnerExerciseData.Descendants("Exercise")
               where ex.Attribute("name") == name
               select new Exercise
               {
                   ExImage = (string)query.Element("image"),
                   ExAudio = (string)query.Element("audio")
               }).Single();
    im.Source = new BitmapImage(new Uri(exercise.ExImage, UriKind.Relative));

Замените

<StackPanel  x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0" Orientation="Horizontal">
    <ListBox x:Name="lbBegExPage">
        <ListBox.ItemTemplate>
            <DataTemplate>
                <StackPanel Margin="10">
                     <Image Source="{Binding ExImage}" />
                </StackPanel>
            </DataTemplate>
         </ListBox.ItemTemplate>    
    </ListBox>
</StackPanel>

на

<Image x:Name="im" Grid.Row="1" Margin="12,0,12,0"/>

Answer 2

Попробуйте этот пересмотренный код:

var data = (from query in beginnerExerciseData.Descendants("Exercise")
                   select new Exercise
                   {
                       ExImage = (string)query.Element("image"),
                       ExAudio = (string)query.Element("audio")

                   }).Take(1);