[UWP小白日记-3]记账项目-1

原文:[UWP小白日记-3]记账项目-1

　　学了一段时间的UWP，来个项目试试手。

　　本来是想边做边学MVVMLight的结果感觉MVVM对于萌新来说太高难，以后再把这个项目改造成MVVMLight框架的项目。

　　下面进入正题。

中间那快空白打算放gridview，用来放标签。利用DataTemplate读取数据库里的标签表。

头部标题和底部标签没什么好说的，主要说下那个pivot的实现。

先来看看图，就知道有什么问题了，然后在解决这个问题。

鼠标点最左边尽然也能跳转页面，这什么鬼，改了他的默认Styel一样不行。

 1 <Style x:Key="RemoveHedaderStyle" TargetType="PivotHeaderItem">
 2         <Setter Property="FontSize" Value="0" />
 3         <Setter Property="FontFamily" Value="{ThemeResource PivotHeaderItemFontFamily}" />
 4         <Setter Property="FontWeight" Value="{ThemeResource PivotHeaderItemThemeFontWeight}" />
 5         <Setter Property="CharacterSpacing" Value="{ThemeResource PivotHeaderItemCharacterSpacing}" />
 6         <Setter Property="Background" Value="Transparent" />
 7         <Setter Property="Foreground" Value="{ThemeResource SystemControlForegroundBaseMediumBrush}" />
 8         <Setter Property="Padding" Value="0" />
 9         <Setter Property="Height" Value="0" />
10         <Setter Property="VerticalContentAlignment" Value="Center" />
11         <Setter Property="IsTabStop" Value="False" />
12         <Setter Property="Template">
13             <Setter.Value>
14                 <ControlTemplate TargetType="PivotHeaderItem">
15                     <Grid x:Name="Grid" Background="{TemplateBinding Background}">
16
17                         <ContentPresenter x:Name="ContentPresenter"
18                                         Content="{TemplateBinding Content}"
19                                         ContentTemplate="{TemplateBinding ContentTemplate}"
20                                         Margin="{TemplateBinding Padding}"
21                                         FontSize="{TemplateBinding FontSize}"
22                                         FontFamily="{TemplateBinding FontFamily}"
23                                         FontWeight="{TemplateBinding FontWeight}"
24                                         HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
25                                         VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
26                             <ContentPresenter.RenderTransform>
27                                 <TranslateTransform x:Name="ContentPresenterTranslateTransform" />
28                             </ContentPresenter.RenderTransform>
29                         </ContentPresenter>
30                     </Grid>
31                 </ControlTemplate>
32             </Setter.Value>
33         </Setter>
34     </Style>

View Code

最后没招，想到把这个listbox外层的Grid的ZIndex改大来覆盖

Canvas.ZIndex="5"

我用listbox替代了pivot的Header。

 1 <ListBox Name="LabelListBox"
 2                          Grid.Row="0"
 3                          Foreground="{ThemeResource ListBoxUnSelectedForegroundBrush}"
 4                          Background="{ThemeResource ListBoxBackgroundBrush}"
 5                          SelectedIndex="{Binding ElementName=MainPivot,
 6                                                      Path=SelectedIndex,
 7                                                      Mode=TwoWay}"
 8                          ItemContainerStyle="{Binding Source={ThemeResource ListBoxItemStyle}}" >
 9
10

View Code

利用绑定来实现跳转，这样不用写任何cs代码。

1 SelectedIndex="{Binding ElementName=MainPivot,
2                                                      Path=SelectedIndex,
3                                                      Mode=TwoWay}"

View Code

最后就是改listbox的styel

主要就是这几个没有注释的视觉状态

<VisualStateManager.VisualStateGroups><VisualStateGroup x:Name="CommonStates"><VisualState x:Name="Normal" /><VisualState x:Name="PointerOver"><!--<Storyboard><ObjectAnimationUsingKeyFrames Storyboard.TargetName="PressedBorder"Storyboard.TargetProperty="BorderBrush"><DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ListBoxPointerOverBorderBrush}" /></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter"Storyboard.TargetProperty="Foreground"><DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ListBoxPointerOverBorderBrush}" /></ObjectAnimationUsingKeyFrames></Storyboard>--></VisualState><VisualState x:Name="Pressed"><!--<Storyboard><ObjectAnimationUsingKeyFrames Storyboard.TargetName="PressedBorder"Storyboard.TargetProperty="BorderBrush"><DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ListBoxPointerOverBorderBrush}" /></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter"Storyboard.TargetProperty="Foreground"><DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ListBoxPointerOverBorderBrush}" /></ObjectAnimationUsingKeyFrames></Storyboard>--></VisualState><VisualState x:Name="Selected"><Storyboard><ObjectAnimationUsingKeyFrames Storyboard.TargetName="PressedBorder"Storyboard.TargetProperty="BorderBrush"><DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ListBoxPointerOverBorderBrush}" /></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter"Storyboard.TargetProperty="Foreground"><DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ListBoxPointerOverBorderBrush}" /></ObjectAnimationUsingKeyFrames></Storyboard></VisualState><VisualState x:Name="SelectedUnfocused"><Storyboard><ObjectAnimationUsingKeyFrames Storyboard.TargetName="PressedBorder"Storyboard.TargetProperty="BorderBrush"><DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ListBoxPointerOverBorderBrush}" /></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter"Storyboard.TargetProperty="Foreground"><DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ListBoxPointerOverBorderBrush}" /></ObjectAnimationUsingKeyFrames></Storyboard></VisualState><VisualState x:Name="SelectedPointerOver"><Storyboard><ObjectAnimationUsingKeyFrames Storyboard.TargetName="PressedBorder"Storyboard.TargetProperty="BorderBrush"><DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ListBoxPointerOverBorderBrush}" /></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter"Storyboard.TargetProperty="Foreground"><DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ListBoxPointerOverBorderBrush}" /></ObjectAnimationUsingKeyFrames></Storyboard></VisualState><VisualState x:Name="SelectedPressed"><Storyboard><ObjectAnimationUsingKeyFrames Storyboard.TargetName="PressedBorder"Storyboard.TargetProperty="BorderBrush"><DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ListBoxPointerOverBorderBrush}" /></ObjectAnimationUsingKeyFrames><ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter"Storyboard.TargetProperty="Foreground"><DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ListBoxPointerOverBorderBrush}" /></ObjectAnimationUsingKeyFrames></Storyboard></VisualState></VisualStateGroup></VisualStateManager.VisualStateGroups>

View Code

收入和支出那2个按钮也是用listbox实现的：

收入那个按钮加了旋转变换

<ListBox Name="ValueTypeListBox"Margin="0,0,0,5"Grid.Column="1" Grid.RowSpan="2"SelectedIndex="0"Foreground="{ThemeResource ListBoxUnSelectedForegroundBrush}"Background="Transparent"ItemContainerStyle="{Binding Source={ThemeResource RadioButtonStyle}}"><ListBoxItem><TextBlock Name="SpendingTextBlock" Text="支出"/></ListBoxItem><ListBoxItem RenderTransformOrigin="0.5,0.5"Margin="0,2,0,0"><ListBoxItem.RenderTransform><CompositeTransform Rotation="180"/></ListBoxItem.RenderTransform><TextBlock Name="IncomeTextBlock" Text="收入" RenderTransformOrigin="0.5,0.5"><TextBlock.RenderTransform><CompositeTransform Rotation="180"/></TextBlock.RenderTransform></TextBlock></ListBoxItem></ListBox>

View Code

这个页面差不多了，下篇打算实现报销页的功能，初步打算使用listview的GroupStyle来实现，上下滚动的时候Group会吸顶。

[UWP小白日记-3]记账项目-1相关推荐

[UWP小白日记-10]程序启动屏（ios解锁既视感）
[UWP小白日记-10]程序启动屏(ios解锁既视感) 原文:[UWP小白日记-10]程序启动屏(ios解锁既视感) 讲一下微软爸爸的开发者大会2016又暴了个表达式动画和Windows.UI.Co ...
[UWP小白日记-9]页面跳转过度动画（二）
[UWP小白日记-9]页面跳转过度动画(二) 原文:[UWP小白日记-9]页面跳转过度动画(二) 又打算动手写了 [UWP小白日记-6]页面跳转过度动画上次写的,这次随着学习的进度使用新的玩法. 最 ...
[UWP小白日记-5]转换MVA学院的XML字幕为SRT
原文:[UWP小白日记-5]转换MVA学院的XML字幕为SRT 开源地址:第二版开源地址GIT 暂时用不了了,在最新的WIN10 10586.494系统上回闪退,正在酝酿第二版 O(∩_∩)O哈哈~ ...
[UWP小白日记-14]正则表达式
匹配2位浮点数: ^(([1-9]+[0-9]*\.{1}[0-9]{1,2})|([0]\.{1}[1-9]+[0-9]{1,2})|([0]\.\d{1,2})|([1-9][0-9]{1,2} ...
[UWP小白日记-1]判断APP是否是第一次运行初始化SQLITE数据库
利用应用程序设置来实现此功能. 1.首先,获取APP设置的容器: ApplicationDataContainer localSettings = ApplicationData.Current.Lo ...
人工智能小白日记语音情感分析探索之2 CNN相关及实验
人工智能小白日记语音情感分析探索之2 CNN相关及实验前言正文内容 1 关于CNN 2 在tensorflow上搭建CNN 2-1 CNN MNIST分类器 2-1-1 输入层 2-1-2 卷积 ...
Java小项目——家庭记账项目
学习Java已经过了半个月左右了,所学的知识已经能够写一些小程序或者小项目,虽然它可能没有那么高级,但是也能检验你之前所学的全部内容.所以今天就与大家分享一下我的小项目经验. 一.需求说明该软件能够 ...
人工智能小白日记之2准备篇
人工智能小白日记之2准备篇关于人工智能应用 1.如何开动? 2.关于python 3.关于TensorFlow 关于人工智能应用应用应用,就是拿来用的,重点在于使用.人工智能科学家做的是研究,研究 ...
小白日记22：kali渗透测试之提权（二）--抓包嗅探
抓包嗅探通过抓包嗅探目标机器的流量,发现账号密码. Windows系统 1.Wirehshark 2.Omnipeek 3.commview 4.Sniffpass 只会抓取识别传输密码的明文协议, ...

[UWP小白日记-3]记账项目-1

[UWP小白日记-3]记账项目-1相关推荐

最新文章

热门文章