[Discovery]初识Windows通用应用(UWP App) - HelloWorld

初识Windows通用应用(UWP App) - HelloWorld

  自从Windows 10第一预览版泄露以来,对UWP一直颇感神秘,今天闲下来有空搞了搞。


  项目结构:


创建项目:


首先创建一个空白的Windows通用应用。


然后再解决方案中会生成一大堆的文件,其中要注意一下MainPage.xml,它是用来定义界面的,其根元素为Page,自定义的界面代码在Grid元素中编写。

详细转到此网址:Create a "Hello, world" app (XAML)


废话不多说,贴代码:


MainPage.xaml文件:

<Page
    x:Class="UWPDemo1.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:UWPDemo1"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup>

                <!--表示大于641 pixel显示的样式-->
                <VisualState x:Name="wideState">
                    <VisualState.StateTriggers>
                        <!--规定最小的宽度为641 pixel-->
                        <AdaptiveTrigger MinWindowWidth="641"/>
                    </VisualState.StateTriggers>

                    <VisualState.Setters>
                        <Setter Target="submitBtn.HorizontalAlignment" Value="Right" />
                        <Setter Target="submitBtn.Margin" Value="300,50,100,0" />
                    </VisualState.Setters>
                </VisualState>

                <!--表示在0 pixel到641 pixel之间显示的样式-->
                <VisualState x:Name="narrowState">
                    <VisualState.StateTriggers>
                        <!--规定最小宽度为0 pixel,因为上面已定义一个比当前宽度大的pixel,所以会在这个区间内(0~641)显示-->
                        <AdaptiveTrigger MinWindowWidth="0" />
                    </VisualState.StateTriggers>
                    
                    <!--设置元素的位置和属性-->
                    <VisualState.Setters>
                        <!--定位contentArea-->
                        <Setter Target="contentArea.Orientation" Value="Vertical" />
                        <!--设定按钮的外边距(Margin:左、上、右、下)-->
                        <Setter Target="submitBtn.Margin" Value="150,50,150,0" />

                        <!--设定文本框的外边距(Margin:左、上、右、下)-->
                        <Setter Target="inputUserName.HorizontalAlignment" Value="Left" />

                        <Setter Target="resultArea.Margin" Value="0,0,0,80" />
                    </VisualState.Setters>
                </VisualState>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
        
        <StackPanel Margin="8,32,0,0">
            <TextBlock Text="Hello World" Margin="0,0,0,40" FontSize="29.333" />
            <TextBlock Text="你叫什么名字?"/>
            <StackPanel Margin="0,20,0,20" x:Name="contentArea">
                <TextBox x:Name="inputUserName" Margin="10,0" HorizontalAlignment="Center" Width="228" />
                <Button x:Name="submitBtn" Content="确认" Click="submitBtn_Click" HorizontalAlignment="Stretch" Margin="125,100,125,0" />
            </StackPanel>
            <TextBlock x:Name="resultArea"/>
        </StackPanel>
    </Grid>
</Page>

对于不同窗口的自适应缩放,官方文档说的很清楚,也是UWP App的核心之一,通过添加一个 VisualStateManager来规定当窗口的Size处于哪一范围内时应用什么样式,样式通过其内VisualState的Setter元素来设定。



MainPage.xaml.cs文件:

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
using UWPDemo1.DDL;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;

//“空白页”项模板在 http://go.microsoft.com/fwlink/?LinkId=402352&clcid=0x409 上有介绍

namespace UWPDemo1
{
    /// <summary>
    /// 可用于自身或导航至 Frame 内部的空白页。
    /// </summary>
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
        }

        private async void submitBtn_Click(object sender, RoutedEventArgs e)
        {
            //创建一个消息框
            var dialog = new ContentDialog(){ Title="消息提示",Content="您的姓名是:"+this.inputUserName.Text+"。",PrimaryButtonText="确定",SecondaryButtonText="取消",FullSizeDesired=false};

            this.resultArea.Text = "您的姓名是"+this.inputUserName.Text + "。";

            dialog.PrimaryButtonClick += Dialog_PrimaryButtonClick;

            dialog.SecondaryButtonClick += Dialog_SecondaryButtonClick;

            //异步等待用户操作的方式显示信息框
            await dialog.ShowAsync();
        }

        private BusinessService service = new BusinessService();

        private void Dialog_SecondaryButtonClick(ContentDialog sender, ContentDialogButtonClickEventArgs args)
        {
            this.resultArea.Text = service.CheckResult(this.inputUserName.Text);
        }

        private  void Dialog_PrimaryButtonClick(ContentDialog sender, ContentDialogButtonClickEventArgs args)
        {
            this.resultArea.Text = service.CheckResult(this.inputUserName.Text);
        }
    }
}

BusinessService类:

using SQLitePCL;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace UWPDemo1.DDL
{
    public class BusinessService
    {
        public String CheckResult(String name)
        {
            if (name.Length == 0)
            {
                return "非常抱歉!您的姓名在尝试确认操作时失败!\n您的姓名确认失败。";
            }
            else
            {
                SQLiteConnection _connection = new SQLiteConnection(DB_NAME);

                using (var statement = _connection.Prepare(SQL_CREATE_TABLE))
                {
                    statement.Step();
                }

                using (var statement = _connection.Prepare(SQL_INSERT))
                {
                    statement.Bind(1, name);
                    statement.Bind(2, "我叫" + name);
                    statement.Step();
                }

                String content = string.Empty;

                using (var statement = _connection.Prepare(SQL_QUERY_VALUE))
                {
                    statement.Bind(1,"Steve Jrong");
                    SQLiteResult result = statement.Step();
                    if (SQLiteResult.ROW == result)
                    {
                        content = statement[0] as String;
                    }
                }

                return "恭喜!您的姓名已确认!\n您的姓名为:" + name + "。\n内容为:"+content;
            }
        }

        private static String DB_NAME = "SQLiteSample.db";
        private static String TABLE_NAME = "SampleTable";
        private static String SQL_CREATE_TABLE = "CREATE TABLE IF NOT EXISTS " + TABLE_NAME + " (Key TEXT,Value TEXT);";
        private static String SQL_QUERY_VALUE = "SELECT Value FROM " + TABLE_NAME + " WHERE Key = (?);";
        private static String SQL_INSERT = "INSERT INTO " + TABLE_NAME + " VALUES(?,?);";
        private static String SQL_UPDATE = "UPDATE " + TABLE_NAME + " SET Value = ? WHERE Key = ?";
        private static String SQL_DELETE = "DELETE FROM " + TABLE_NAME + " WHERE Key = ?";
    }
}

这里还使用了SQLite嵌入式数据库进行增加和查询操作,具体引用步骤如下:

下载对应平台的SQLite组件,这里因为是UWP Platform,所以文件是sqlite-uap-3090200.vsix;

下载完成后双击安装,之后重启Visual Studio;

在项目中引用SQLite组件;

项目右键点击“管理NuGet程序包”,在弹出的窗口中搜索“SQLitePCL”并安装,此时项目中会多出SQLitePCL的引用。

此时SQLite的环境就配置完毕了。


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值