「東雲 忠太郎」の平凡な日常のできごと

「東雲 忠太郎」の平凡な日常のできごと

2024.03.18
XML
カテゴリ: C#.NET


Frameコントロールは、WPFアプリケーションで他のページやコンテンツを表示するための便利な方法です。以下は、Frameコントロールを活用する簡単なサンプルコードです。


まず、MainWindow.xaml ファイルに Frame コントロールを追加します。


```xml

<Window x:Class="WpfFrameControlExample.MainWindow"

        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

        Title="Frame Control Example" Height="450" Width="800">

    <Grid>

        <Grid.RowDefinitions>

            <RowDefinition Height="Auto"/>

            <RowDefinition Height="*"/>

        </Grid.RowDefinitions>


        <!-- ナビゲーション ボタン -->

        <StackPanel Orientation="Horizontal" Margin="10">

            <Button Content="Page 1" Click="Page1Button_Click"/>

            <Button Content="Page 2" Click="Page2Button_Click"/>

        </StackPanel>


        <!-- Frame コントロール -->

        <Frame Name="mainFrame" Grid.Row="1"/>

    </Grid>

</Window>

```


次に、MainWindow.xaml.cs ファイルで、ボタンクリック時に Frame コントロール内にページを表示するためのイベントハンドラーを実装します。


```csharp

using System.Windows;


namespace WpfFrameControlExample

{

    public partial class MainWindow : Window

    {

        public MainWindow()

        {

            InitializeComponent();

        }


        private void Page1Button_Click(object sender, RoutedEventArgs e)

        {

            // Page1.xaml を表示

            mainFrame.Navigate(new Page1());

        }


        private void Page2Button_Click(object sender, RoutedEventArgs e)

        {

            // Page2.xaml を表示

            mainFrame.Navigate(new Page2());

        }

    }

}

```


最後に、表示する各ページのコードビハインドを作成します。例えば、Page1.xaml と Page2.xaml を作成し、それぞれに適切なコンテンツを配置します。


これで、C# WPF アプリケーションで Frame コントロールを活用してページを切り替える準備が整いました。ボタンをクリックすると、Frame 内に指定したページが表示されます。






お気に入りの記事を「いいね!」で応援しよう

Last updated  2024.03.18 08:07:37


【毎日開催】
15記事にいいね!で1ポイント
10秒滞在
いいね! -- / --
おめでとうございます!
ミッションを達成しました。
※「ポイントを獲得する」ボタンを押すと広告が表示されます。
x

© Rakuten Group, Inc.
Create a Mobile Website
スマートフォン版を閲覧 | PC版を閲覧
Share by: