MochiuWiki : SUSE, EC, PCB

「Avalonia UI - StackPanel」の版間の差分

📢 Webサイト閉鎖と移転のお知らせ
このWebサイトは2026年9月に閉鎖いたします。
新しい記事は移転先で追加しております。（旧サイトでは記事を追加しておりません）

← 古い編集
ビジュアルウィキテキスト
 
185行目: 185行目:
<br>
<br>
StackPanelのメソッドの詳細を知りたい場合は、[https://reference.avaloniaui.net/api/Avalonia.Controls/StackPanel/#Methods Avalonia UIの公式Webサイト]を参照すること。<br>
StackPanelのメソッドの詳細を知りたい場合は、[https://reference.avaloniaui.net/api/Avalonia.Controls/StackPanel/#Methods Avalonia UIの公式Webサイト]を参照すること。<br>
<br><br>
== 使用例 ==
以下の例では、StackPanelは垂直方向に要素を配置して、フォーム全体を構成している。<br>
ボタンおよびプルダウンの配置には、水平方向のStackPanelを使用している。<br>
<br>
<syntaxhighlight lang="xml">
<!-- MainWindow.axaml -->
<Window xmlns="https://github.com/avaloniaui"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        x:Class="AvaloniaApplication.MainWindow"
        Title="StackPanel サンプル"
        Width="400"
        Height="500">
    <!-- メインのStackPanel - 垂直方向に要素を配置 -->
    <StackPanel Margin="20">
      <!-- ヘッダセクション -->
      <TextBlock Text="ユーザ情報入力"
                  FontSize="24"
                  FontWeight="Bold"
                  Margin="0,0,0,20"/>
      <!-- 入力フォームセクション -->
      <TextBlock Text="氏名:" Margin="0,0,0,5"/>
      <TextBox x:Name="NameTextBox"
                Margin="0,0,0,10"
                Watermark="氏名を入力してください"/>
      <!-- メールアドレス入力セクション -->
      <TextBlock Text="メールアドレス:" Margin="0,0,0,5"/>
      <TextBox x:Name="EmailTextBox"
                Margin="0,0,0,10"
                Watermark="メールアドレスを入力してください"/>
      <!-- 年齢入力セクション -->
      <TextBlock Text="年齢:" Margin="0,0,0,5"/>
      <NumericUpDown x:Name="AgeNumericUpDown"
                      Minimum="0"
                      Maximum="120"
                      Value="20"
                      Margin="0,0,0,20"/>
      <!-- 性別選択セクション - 水平方向のStackPanel -->
      <TextBlock Text="性別:" Margin="0,0,0,5"/>
      <StackPanel Orientation="Horizontal"
                  Spacing="10"
                  Margin="0,0,0,20">
          <RadioButton Content="Male"
                      GroupName="Gender"
                      IsChecked="True"/>
          <RadioButton Content="Female"
                      GroupName="Gender"/>
          <RadioButton Content="その他"
                      GroupName="Gender"/>
      </StackPanel>
      <!-- 趣味選択セクション -->
      <TextBlock Text="趣味:" Margin="0,0,0,5"/>
      <StackPanel Margin="0,0,0,20">
          <CheckBox Content="読書" Margin="0,0,0,5"/>
          <CheckBox Content="スポーツ" Margin="0,0,0,5"/>
          <CheckBox Content="音楽" Margin="0,0,0,5"/>
          <CheckBox Content="旅行" Margin="0,0,0,5"/>
      </StackPanel>
      <!-- ボタンセクション - 水平方向のStackPanel -->
      <StackPanel Orientation="Horizontal"
                  HorizontalAlignment="Right"
                  Spacing="10">
          <Button Content="クリア"
                  Width="100"
                  x:Name="ClearButton"/>
          <Button Content="送信"
                  Width="100"
                  Classes="accent"
                  x:Name="SubmitButton"/>
      </StackPanel>
    </StackPanel>
</Window>
</syntaxhighlight>
<br>
<syntaxhighlight lang="c#">
// MainWindow.axaml.csファイル
using Avalonia.Controls;
using Avalonia.Interactivity;
using MsBox.Avalonia;
namespace AvaloniaApplication
{
    public partial class MainWindow : Window
    {
      public MainWindow()
      {
          InitializeComponent();
          // ボタンのクリックイベントハンドラを設定
          ClearButton.Click  += ClearButton_Click;
          SubmitButton.Click += SubmitButton_Click;
      }
      // クリアボタンを押下した時
      private void ClearButton_Click(object sender, RoutedEventArgs e)
      {
          // 各入力フィールドをクリア
          NameTextBox.Text      = string.Empty;
          EmailTextBox.Text      = string.Empty;
          AgeNumericUpDown.Value = 20;  // デフォルト値に戻す
          // チェックボックスをすべて未選択に
          var checkBoxes = this.FindControl<StackPanel>("HobbiesPanel")
                              .Children.OfType<CheckBox>();
          foreach (var checkbox in checkBoxes)
          {
            checkbox.IsChecked = false;
          }
      }
      // 送信ボタンを押下した時
      private async void SubmitButton_Click(object sender, RoutedEventArgs e)
      {
          // 入力値の検証
          if (string.IsNullOrWhiteSpace(NameTextBox.Text))
          {
            // 警告メッセージを表示
            var msgbox = MessageBoxManager.GetMessageBoxStandard("入力エラー",
                                                                  "氏名を入力",
                                                                  ButtonEnum.Ok,
                                                                  Icon.Warning);
            await msgbox.ShowAsync();
            return;
          }
          if (string.IsNullOrWhiteSpace(EmailTextBox.Text))
          {
            // 警告メッセージを表示
            var msgbox = MessageBoxManager.GetMessageBoxStandard("入力エラー",
                                                                  "メールアドレスを入力",
                                                                  ButtonEnum.Ok,
                                                                  Icon.Warning);
            await msgbox.ShowAsync();
            return;
          }
          // 送信確認のダイアログを表示
          var confirmBox = MessageBoxManager.GetMessageBoxStandard("確認",
                                                                  "入力した情報を送信しますか？",
                                                                  ButtonEnum.YesNo,
                                                                  Icon.Question);
          var result = await confirmBox.ShowAsync();
          if (result == ButtonResult.Yes)
          {
            // ...略 (送信処理)
            // 成功メッセージを表示
            var successBox = MessageBoxManager.GetMessageBoxStandard("送信完了",
                                                                      "情報を正常に送信",
                                                                      ButtonEnum.Ok,
                                                                      Icon.Success);
            await successBox.ShowAsync();
          }
      }
    }
}
</syntaxhighlight>
<br><br>
<br><br>


「http://mochiuwiki.e2.valueserver.jp/index.php?title=Avalonia_UI_-_StackPanel」から取得