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;
}

(三)运行效果

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

相关推荐
samble7 小时前
从零搭建灌装监控系统(十七):LiveCharts 实时温度曲线
c#·wpf·mvvm·modbus·工业控制
掉进电商坑三年没爬出来的东叔9 小时前
Vibe Coding实战三:把AI做的小工具部署上云,手机电脑随时用
人工智能·智能手机
沫璃染墨10 小时前
《Qt从零入门系列(十三):QSS样式表详解——从选择器与层叠规则到控件美化实战》
开发语言·css·c++·qt·ui·qt6.3·qss
wulechun12 小时前
深度解析weiweifan/Big-Data-Resources:构建从基础理论到实战面试的全栈大数据学习体系指南
智能手机
李永奉14 小时前
日常使用的锂电池上,新、旧锂电池的差异分析
单片机·嵌入式硬件·物联网·智能手机·电脑
大雷神15 小时前
从一道24点到同屏双人派对:用鸿蒙开发助手起步,复用已有App开发手机元服务
华为·智能手机·harmonyos
淡海水15 小时前
02-07-原理篇-GC暂停时间的本质
开发语言·unity·c#·gc·暂停时间
wulechun15 小时前
深入解析Ewenwan/Ros项目:构建机器人操作系统核心算法与SLAM导航实战的全方位指南
智能手机
WarPigs15 小时前
UI路径配置SO>字典json工作流
ui·unity
stevenzqzq16 小时前
mvi理解2-ui状态和业务状态
ui