0

Windows ユニバーサル アプリを作成する次のXAMLコードがあります。

<Page
x:Class="CalculationQuizzer.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:CalculationQuizzer"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Image Source="ms-appx:///Images/kingscross.jpg" Opacity=".3" Stretch="Fill"></Image>
    <StackPanel VerticalAlignment="Center">
        <TextBlock Text="Calculation Quizzer" TextAlignment="Center" Margin="4" FontSize="16"></TextBlock>
        <TextBlock Name="questionTextBlock" Text="" TextAlignment="Center" Margin="4"></TextBlock>
        <StackPanel Orientation="Horizontal" HorizontalAlignment="Center" Margin="4">
            <TextBox Name="answerTextBox" Width="100" Margin="4" TextAlignment="Center"></TextBox>
            <Button Content="Check Answer" Name="checkAnswerButton" HorizontalAlignment="Center"  Margin="4" Click="checkAnswerButton_Click" ></Button>
        </StackPanel>
        <Button Content="Next Question" Name="getNextQuestionButton" HorizontalAlignment="Center"  Margin="4" Click="getNextQuestionButton_Click" ></Button>
        <TextBlock Name="resultTextBlock" Text="" TextAlignment="Center" Margin="4"></TextBlock>
    </StackPanel>
    <MediaElement Name="soundMediaElement"></MediaElement>
</Grid>

ご覧のとおり、Grid はそのkingscross.jpg背景に呼び出される Image を使用します。Next Answerボタンをクリックすると、グリッドの背景が と呼ばれる画像に変わるようにしようとしていますSKV_8915_s.jpg

の背後にあるコードは次のXAMLとおりです。

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;
using Windows.UI.Xaml.Media.Imaging;

// The Blank Page item template is documented at http://go.microsoft.com/fwlink/?LinkId=402352&clcid=0x409

namespace CalculationQuizzer
{
    /// <summary>
    /// An empty page that can be used on its own or navigated to within a Frame.
    /// </summary>
    public sealed partial class MainPage : Page
    {
        IQuizObject activeQuiz;

        public MainPage()
        {
            this.InitializeComponent();

            activeQuiz = new AdditionQuizObject();
            questionTextBlock.Text = activeQuiz.GetQuestion();
        }

        private void getNextQuestionButton_Click(object sender, RoutedEventArgs e)
        {
            activeQuiz.NextQuestion();
            questionTextBlock.Text = activeQuiz.GetQuestion();
            answerTextBox.Text = "";
            resultTextBlock.Text = "";
        }

        private void checkAnswerButton_Click(object sender, RoutedEventArgs e)
        {
            if (activeQuiz.CheckAnswer(answerTextBox.Text))
            {
                resultTextBlock.Text = "Correct! Well done.";
                Uri soundsource = new Uri("ms-appx:///Sounds/right.wav");
                soundMediaElement.Source = soundsource;
                soundMediaElement.Play();
            }
            else
            {
                resultTextBlock.Text = "Sorry, that is not correct.";
                Uri soundsource = new Uri("ms-appx:///Sounds/wrong.wav");
                soundMediaElement.Source = soundsource;
                soundMediaElement.Play();
            }
        }
    }

CheckAnswerButton_Clickグリッドの背景を に変更するために、どのコードをイベント ハンドラーにプラグインする必要があるかを教えてくれる人がいるとSKV_8915_s.jpgしたら、それは非常に素晴らしいことです。

4

2 に答える 2