92.一个简单的输入与显示示例 Maui例子 C#例子

一、关于项目命名的注意事项

在开发.NET MAUI项目时,项目命名是一个不可忽视的细节。如果你习惯了在C#控制台或WPF项目中使用中文项目名称,那么在.NET MAUI中,你可能会遇到一些问题。我之前就因为使用中文项目名称而导致项目无法直接运行,这让我感到非常困惑。在.NET MAUI中,项目名称最好使用英文。如果你想在.NET MAUI中开发应用,一定要谨慎谨慎再谨慎。

二、实现输入与显示功能的步骤

接下来,我将通过一个简单的示例,展示如何在.NET MAUI中实现输入框输入内容,点击按钮后将内容显示在另一个区域的功能。

(一)布局设计

在布局方面,我们使用ScrollView包裹一个VerticalStackLayout,这样可以确保内容在不同设备上都能良好地显示。在VerticalStackLayout中,我们依次放置了三个控件:一个Editor作为输入框,一个Button作为触发显示的按钮,以及一个Label用于显示内容。以下是具体的XAML代码:

XML 复制代码
<ScrollView>
    <VerticalStackLayout
        Padding="30,0"
        Spacing="25"
        >
        <!-- 输入框 -->
        <Editor x:Name="inputEditor" Placeholder="请输入内容"              
                PlaceholderColor="Gray"
                HorizontalOptions="Fill"
                Margin="0,0,0,6"
                HeightRequest="200"
                />
        <!-- 按钮 -->
        <Button Text="显示内容" Clicked="OnShowContentClicked"
                HorizontalOptions="Fill"/>
        <!-- 显示内容的标签 -->
        <Label x:Name="outputLabel" Text="点击按钮显示内容" FontSize="16"
               HorizontalOptions="Fill"
                Margin="0,6,0,0"
                />
    </VerticalStackLayout>
</ScrollView>

(二)逻辑实现

在逻辑方面,我们只需要在按钮的点击事件中,将Editor中的内容赋值给Label即可。以下是对应的C#代码:

cs 复制代码
private void OnShowContentClicked(object sender, EventArgs e)
{
    // 获取输入框的内容并显示在标签中
    outputLabel.Text = inputEditor.Text;
}

(三)运行效果

当你运行这个应用时,会看到一个带有输入框、按钮和显示区域的界面。在输入框中输入任意内容,然后点击按钮,输入的内容就会立即显示在下方的标签中。

相关推荐
小雨下雨的雨12 小时前
Flutter 框架跨平台鸿蒙开发 —— Center 控件之完美居中之道
flutter·ui·华为·harmonyos·鸿蒙
小小工匠13 小时前
LLM - A2UI:Google 引领的生成式 UI 革命
ui·a2ui
henreash13 小时前
Language-ext
c#·函数式编程
小雨下雨的雨13 小时前
Flutter 框架跨平台鸿蒙开发 —— Placeholder 控件之布局雏形美学
flutter·ui·华为·harmonyos·鸿蒙系统
kylezhao201914 小时前
C#根据时间加密和防止反编译
java·前端·c#
kylezhao201914 小时前
在C#中实现异步通信
开发语言·c#
Pony_1814 小时前
面试 - web ui 自动化
前端·ui·自动化
观无14 小时前
雷塞运动控制(DMC3800)C#基础应用案例分享
开发语言·c#
Larry_Yanan15 小时前
Qt安卓开发(一)Qt6.10环境配置
android·开发语言·c++·qt·学习·ui
小雨下雨的雨15 小时前
Flutter 框架跨平台鸿蒙开发 —— Padding 控件之空间呼吸艺术
flutter·ui·华为·harmonyos·鸿蒙系统