トップ > .NET MAUI > 【.NET MAUI】入力した文字をダイアログ（ポップアップ）で表示する

【.NET MAUI】入力した文字をダイアログ（ポップアップ）で表示する

.NET MAUI .NET

最近、なかなか .NET の技術を追えなかったのですが少し時間ができたので .NET MAUI を触ってみようと思います。まずは入力と出力のキホンから。

デザイン

適当に作ります。XAMLコントロールは MS の公式ドキュメントを漁ると出てくるので、それ通りに書いてみます。

<ScrollView>
        <VerticalStackLayout
            Spacing="25"
            Padding="30,0"
            VerticalOptions="Center">
            
            <Label
                Text="なんかいい感じのアプリ"
                SemanticProperties.HeadingLevel="Level2"
                SemanticProperties.Description="Welcome to dot net Multi platform App U I"
                FontSize="18"
                HorizontalOptions="Center" />

            <Entry 
                x:Name="TextInput"
                Placeholder="なにか入力して"
                WidthRequest="100"
                />

            <Button
                x:Name="TextBtn"
                Text="押してね！"
                Clicked="OnTextBtnClicked"
                HorizontalOptions="Center"
                />

        </VerticalStackLayout>
</ScrollView>

コードビハインド

なんかポップアップを表示できるみたいなので、試してみます。WPFでいうところの MessageBox ですね。

private async void OnTextBtnClicked(object sender, EventArgs e)
{
    await DisplayAlert("あなたの入力した文字は", $"{TextInput.Text}", "閉じる");
}

たったこれだけで表示できるのすごいですよね～！ C#でアプリ開発を経験したことがあれば、x:Name でコントロールを指定して、その中の Text プロパティを文字列補間で表示しているんだなぁ～みたいな雰囲気で書けます。

実行結果

まずは Android 12 (Google Pixel 5 エミュレータ)

次に Windows

たったこれだけで複数のプラットフォームに対応するのやばいｗ
しかも Windows の場合はダイアログとして表示できます。WinUIのダイアログって XamlRoot とかが必須で結構面倒なのですが、MAUIだと簡単ですね。

MAUI、面白いです！

参考

learn.microsoft.com

learn.microsoft.com