3. 单页App

上一篇文章我们创建了 Xamarin 应用程序,当我们创建完应用程序后 VS 2019 帮我们生成了一个名为 MainPage 的 xaml 文件,这个文件在当前项目中是仅有的页面,我们称这个应用程序称为 单页应用程序 。下面我们就修改一下上一篇文章所创建的应用程序。首先我们打开 MainPage.xaml 文件,将模板中的代码修改为如下形式:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:d="http://xamarin.com/schemas/2014/forms/design"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             mc:Ignorable="d"
             x:Class="Notes.MainPage">

    <StackLayout Margin="10,35,10,10">
        <Label Text="Notes" HorizontalOptions="Center" FontAttributes="Bold"/>
        <Editor x:Name="editor" Placeholder="输入笔记内容" HeightRequest="100"/>
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
            <Button Text="保存" x:Name="SaveButton" Clicked="SaveButton_Clicked"/>
            <Button Grid.Column="1" Text="删除" x:Name="DeleteButton" Clicked="DeleteButton_Clicked"/>
        </Grid>
    </StackLayout>
</ContentPage>

上述代码定义了用户界面,界面中包含 一个 Label 控件、一个文本输入控件、两个按钮控件。其中两个按钮控件水平放置在了 Grid 中,并且给这两个按钮绑定了保存和删除事件。

Note:上述控件我将在后面进行详细讲解。

打开 MainPage.xaml.cs 文件,我们编写刚才给两个按钮绑定的两个事件,首先我们先编写保存事件 SaveButton_Clicked ,这个事件将会在保存按钮被点击的时候会将文本输入控件中的内容保存到本地文件中。

private void SaveButton_Clicked(object sender, EventArgs e)
{
    File.WriteAllText(filename,editor.Text);
}

接下来我们编写删除事件 DeleteButton_Clicked ,该方法会删除本地文件并清空文本输入控件中的内容。

private void DeleteButton_Clicked(object sender, EventArgs e)
{
    if (File.Exists(filename))
    {
        File.Delete(filename);
    }
    editor.Text = string.Empty;
}

在上述两段代码中我们一直在使用 filename 这个变量,下面我们就将这个变量定义出来。

string filename = Path.Combine(Environment.GetFolderPath(
    Environment.SpecialFolder.LocalApplicationData),"note.nt");
public MainPage()
{
    InitializeComponent();
    if(File.Exists(filename))
    {
        editor.Text = File.ReadAllText(filename);
    }
}

到这里我们已经将 Notes app 的基础代码编写完成,下面我们就运行一下这个 app 看一下效果。

我们填写要保存的内容然后单击保存按钮,我们所填写的内容将会被保存在本地文件 note.nt 中。当我们退出应用程序再次进入后,将会把保存在文件中的内容显示在文本输入控件中。我们点击删除按钮将删除文件并清空文本输入控件。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • SQL Server 每日一题--老N的收入

    刚解决完 Boss 提出的找出收入排名第二的问题,这时二号 Boss 提出了新需求,他想查询出指定排名的员工的工资,如果存在相同收入的员工只显示其中一个。

    喵叔
  • Entity Framework Core 捕获数据库变动

    在实际项目中我们往往需要记录存储在数据库中数据的变动(例如修改数据前记录下数据的原始值),这样一来在发生误操作时可以将数据恢复到变动前的状态,也可以追溯到数据的...

    喵叔
  • Java面试题之运算符(一)

    1.若有 a=3,则执行下列语句为a的值为? a+=a*=a; A. 3 B. 12 C. 9 D. 18

    喵叔
  • Flutter实现顶部导航栏功能

    在这里只写顶部导航栏的实现,底部的可以参照我之前的文章 tabbar导航栏的实现

    任我行RQ
  • GMIS 2017 | 第四范式首席科学家杨强:AlphaGo的弱点及迁移学习的应对(附视频)

    机器之心整理 演讲者:杨强 5 月 27-28 日,机器之心在北京顺利主办了第一届全球机器智能峰会(GMIS 2017),来自美国、加拿大、欧洲,香港及国内的众...

    机器之心
  • Hacking with iOS: SwiftUI Edition - Word Scramble 项目——List 介绍

    这个项目将是另一个游戏,尽管实际上这只是我偷偷摸摸地介绍更多Swift和SwiftUI知识的方法!游戏将向玩家显示一个随机的八个字母的单词,并要求他们用单词来制...

    韦弦zhy
  • NLP之keras中文文本分类系列算法封装,简单易用(超详细教程)

    中文长文本分类、短句子分类、多标签分类、两句子相似度(Chinese Text Classification of Keras NLP, multi-label...

    大数据技术与机器学习
  • 前端新趋势,我是第一个吃螃蟹的人?

    这两年,前端圈真的很热闹,当你以为前端圈angular、react、vue等呈现三足鼎立之势时,其实冰山下面已经开始暗流涌动。当你还在为错过第三届VueConf...

    闰土大叔
  • 如何使用高亮、表格渲染

    本文将详细介绍如何对表格中的数据种类设置高亮,以及设置表格渲染,希望对大家有所帮助。

    腾讯云商业智能分析团队
  • CVPR 2019 论文大盘点—文本图像相关篇

    其中研究文本检测的最多,共 7 篇,包括已经非常知名的PSENet,还有最近异常火爆的CRAFT。

    CV君

扫码关注云+社区

领取腾讯云代金券