文档章节

【万里征程——Windows App开发】控件大集合2

NoMasp
 NoMasp
发布于 2015/09/08 21:46
字数 1685
阅读 0
收藏 0

【推荐】2019 Java 开发者跳槽指南.pdf(吐血整理) >>>

下面再来看看一些前面还没有讲过的控件,不过控件太多以至于无法全部列出来,大家只好举一反三啦。

Button

前面最常用的控件就是Button啦,Button还有一个有意思的属性呢,当把鼠标指针放在Button上时,就会在Button的头顶冒出一串文本啦。这个不太截图哎……

<Button ToolTipService.ToolTip="Go to www.blog.csdn.net/nomasp" Margin="692,458,0,230" />

Button有一个很有意思的小知识哦。

<Button Content="摩天轮" Margin="134,363,0,367">               
    <ToolTipService.ToolTip>
        <Image MaxHeight="80" MaxWidth="100" Source="Assets/343219.jpg"/>       
    </ToolTipService.ToolTip>     
</Button>

只要把鼠标放到Button上面就会显示出这张图片啦,也叫做帮助提示吧。其实更简单的方法是下面这种啦。它显示的是一个后退的样式,而且鼠标放上去会有文字Back提示哦。

<Button Content="摩天轮" ToolTipService.ToolTip="Back"
                Style="{StaticResource NavigationBackButtonNormalStyle}" />  

ToggleSwitch

还有一个控件和Button很像呢,它像开关一样。

<ToggleSwitch x:Name="toggleSwitch1" Header="NoMasp Toggle" OnContent="On" OffContent="Off" Toggled="ToggleSwitch_Toggled" Margin="409,468,0,227"/>

<ToggleSwitch x:Name="toggleSwitch2" Header="NoMasp Toggle" OnContent="On" OffContent="Off" IsOn="True" Toggled="ToggleSwitch_Toggled" Margin="409,565,0,130"/>

这里写图片描述

MessageDialog

这控件和Button一起讲还蛮合适的哈,我们随意添加一个Button,然后写好Click事件如下。

private async void Button_Click(object sender, RoutedEventArgs e)
{
    Windows.UI.Popups.MessageDialog messageDialog =
        new Windows.UI.Popups.MessageDialog("噢,你刚刚踩到了地雷!");
    await messageDialog.ShowAsync();
}

注意要在函数上加上async表示异步哟,我室友就遇到了这个问题。

这里写图片描述

用浮动控件做更多的事情,传送门:【万里征程——Windows App开发】用浮出控件做预览效果

ComboBox

ComboBox提供了下拉列表,自然也是一个很常用的控件咯。

<ComboBox Height="50" Width="200" Name="cbox1"  SelectionChanged="cbox1_SelectionChanged" Margin="17,47,1049,671">
     <x:String>Select 1</x:String>
     <x:String>Select 2</x:String>
     <x:String>Select 3</x:String>
     <x:String>Select 4</x:String>
</ComboBox>

这里写图片描述

这里写图片描述

ListBox

ListBox控件和ComboBox很相似,都可以让用户选择已经嵌入在列表中的选项。用法如下:

<ListBox x:Name="listBox1" SelectionChanged="listBox1_SelectionChanged" Width="100">
    <x:String>Item 1</x:String>
    <x:String>Item 2</x:String>
    <x:String>Item 3</x:String>
</ListBox>

DatePicker、TimePicker

Win平台设置时间的控件倒是很有特色呢,DatePicker和TimePicker。

<DatePicker Foreground="Red" Header="NoMasp Date" Margin="3,177,0,533"/>
<TimePicker Foreground="Green" Header="NoMasp Time" Margin="3,246,0,464" Width="289"/>

以下既是截图,又是写这篇博客的时间啦。
这里写图片描述

想了解更多这两个控件的内容请访问: 【万里征程——Windows App开发】DatePicker&Timepicker

FlipView

FlipView是一个可以让用户逐个浏览的项目集合的控件,下面是相关的示例代码啦。CommonAssets文件夹完全可以定义在Shared目录下,这样WP也可以拿来用了。我一直都没有截WP的图是因为我没有装虚拟机,我用的是真机调试的。

<FlipView>
    <Image Source="CommonAssets/5083.jpg"/>
    <Image Source="CommonAssets/5503.jpg"/>
    <Image Source="CommonAssets/6121.jpg"/>
</FlipView>

这里写图片描述

除此之外呢,我们还可以在后台代码中添加,下面的第二段代码和第一段类似,不过是用的List。

FlipView flipView = new FlipView();
flipView.Items.Add("Item 1");
flipView.Items.Add("Item 2");
flipView.SelectionChanged += filpView_SelectionChanged;
grid1.Children.Add(flipView);
List<String> listItems = new List<string>();
listItems.Add("Item 1");
listItems.Add("Item 2"); 
FlipView flipView = new FlipView();
flipView.ItemsSource = listItems;
flipView.SelectionChanged += filpView_SelectionChanged; 
grid1.Children.Add(flipView);

除了这2种方式之外呢,用CollectionViewSource来绑定数据也是完全没问题的哦。

<Page.Resources>   
    <CollectionViewSource x:Name="collectionVSFlipView" Source="{Binding Items}"/>
</Page.Resources>

上面是一段资源文件,然后FlipView ListView的ItemsSource添加静态资源绑定就OK啦。

<FlipView x:Name="flipView" ItemsSource="{Binding Source={StaticResource collectionVSFlipView}}"/>

如果大家自己试过FlipView就会发现它的图片资源等都是左右滚动的,如果要用上下滚动呢?那就用下面这个ItemsPanelTemplate模板就好啦。

<FlipView.ItemsPanel>
     <ItemsPanelTemplate>
          <VirtualizingStackPanel Orientation="Vertical"/>
     </ItemsPanelTemplate>
</FlipView.ItemsPanel>

ScrollBar

如果有缩放图片,并且可以滚动以查看图片的需要,那么就可以用ScrollBar啦。这主要是能留给图片的位置太小以至于图片无法全部显示出来。

<ScrollViewer ZoomMode="Enabled" MaxZoomFactor="12" HorizontalScrollMode="Enabled" HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Visible" VerticalScrollMode="Enabled" Height="200" Width="200" Margin="363,35,803,533">

    <Image Source="CommonAssets/6121.jpg" Height="400" Width="400"/> 
</ScrollViewer>

这里写图片描述

Viewbox

还有一个控件则可以将图片等缩放到指定的大小哟,那就是Viewbox啦。大家看看下面这个图,是不是很炫酷呢。

    <Viewbox MaxHeight="33" MaxWidth="33" Margin="23.5,35,-26,-35">
            <Image Source="CommonAssets/5503.jpg" Opacity="0.9 "/>
        </Viewbox>
        <Viewbox MaxHeight="66" MaxWidth="66" Margin="26,35,-26,-35">
            <Image Source="CommonAssets/5503.jpg" Opacity="0.6"/>
        </Viewbox>
        <Viewbox MaxHeight="99" MaxWidth="99" Margin="26,35,-26,-35">
            <Image Source="CommonAssets/5503.jpg" Opacity="0.3"/>
        </Viewbox>

这里写图片描述

GridView

相信大家都已经看过了GridView控件,很多Modern应用都会采用的。其和ComboBox挺类似的。

<GridView x:Name="gView1" SelectionChanged="gView1_SelectionChanged">
    <x:String>Item 1</x:String>
    <x:String>Item 2</x:String>
    <x:String>Item 3</x:String>
</GridView>

HyperlinkButton

HyperlinkButton既可以作为Button来用,也可以用来做超链接。

<HyperlinkButton Content="NoMasp--CSDN" NavigateUri="http://blog.csdn.net/nomasp" />

ProgressBar

相信大家都挺喜欢玩进度条的吧?我本人倒是觉得相比于Win7及Vista等,Win8的进度条变得更加有意思了。

<ProgressBar x:Name="progressBar1" IsIndeterminate="True" Width="100" Margin="607,377,659,385"/>
<ProgressBar x:Name="progressBar2" Value="70 " Width="100" Margin="607,352,659,410"/>

第一个图是运行中的进度条啦;第二个图中的上图也就是progressBar1,其Value为70的确定进度的进度条,下图则是progressBar2,是运行中的进度条在设计器中的静止状态。

这里写图片描述

ProgressRing

环形的进度条会不会更好玩呢?

<ProgressRing x:Name="progressRing1" IsActive="True" />

这里写图片描述

Slider

比如说win8上的音量呀、屏幕亮度呀,这些地方都用到了滑动条。这里来看看它的ThumbToolTipValueConverter属性吧。为了将值绑定到Slider上,我们需要有一个类,这个类需要一个为数据绑定提供值转换的接口。可视化元素也就是Slider为绑定目标,其有2个方向:数据源->数据->绑定目标,绑定目标->数据->数据源。

我们需要写一个类,可以直接在MainPage.xaml.cs下写,但更好是单独新建一个类,再考虑到这个是通用应用,所以将类新建到Shared下比较合适。

public class ThumbToolTipValueConverter : Windows.UI.Xaml.Data.IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, string language)
    {
        if(value is double)
        {
                double dValue= System.Convert.ToDouble(value);
                return dValue;                
        }
        return null;
     }

    public object ConvertBack(object value, Type targetType, object parameter, string language)
    {
        return null;
    }
}

然后添加以下代码作为本地实例化的资源即可。

<Page.Resources>
   <local:ThumbToolTipValueConverter x:Key="thumbToolTipValueC"/>
</Page.Resources>

最后就是传说中的本体啦。

<Slider Width="200" Height="50" Name="slider1" ThumbToolTipValueConverter="{StaticResource thumbToolTipValueC}" />

这里写图片描述

我们还可以添加一个Button和TextBlock,让点击来在TextBlock上显示Slider的Value。

private void btnGetSliderValue_Click(object sender, RoutedEventArgs e)
{
    tblockSlider.Text = slider1.Value.ToString();
}

这里写图片描述

再后面的博客中,我们还会学习到用Slider来控制图片的缩放哟。感谢大家的支持!



为使本文得到斧正和提问,转载请注明出处:
http://blog.csdn.net/nomasp

版权声明:本文为 NoMasp柯于旺 原创文章,未经许可严禁转载!欢迎访问我的博客:http://blog.csdn.net/nomasp

本文转载自:http://blog.csdn.net/nomasp/article/details/44781145

NoMasp
粉丝 7
博文 334
码字总数 0
作品 0
镇江
程序员
私信 提问
nomasp 博客导读:Lisp/Emacs、Algorithm、Android

版权声明:转载请联系本人,感谢配合!本站地址:http://blog.csdn.net/nomasp https://blog.csdn.net/NoMasp/article/details/44966625 Profile Introduction to Blog 您能看到这篇博客导读...

nomasp
2015/09/17
0
0
UWP入门教程1——UWP的前世今生

目录 引言 设备族群 UI 和通用输入模式 通用控件和布局面板 工具 自适应扩展 通用输入处理 引言 在本篇文章中,可以掌握以下知识: 设备族群,如何决定目标设备 新的UI控件和新面板帮助你适应...

葡萄城控件技术团队
2015/12/25
98
0
浙江万里学院-阿里云大数据应用学院2018级新生开学典礼隆重举行

2018年10月11日,由浙江万里学院、阿里云、慧科集团三方共建的阿里云大数据应用学院2018级新生开学典礼在浙江万里学院隆重举行。浙江万里学院阿里云大数据应用学院不仅是浙江省首个,也是目前...

昕华
2018/10/12
0
0
扩展GridView控件——为内容项添加拖放及分组功能

引言 相信大家对GridView都不陌生,是非常有用的控件,用于平铺有序的显示多个内容项。打开任何WinRT应用或者是微软合作商的网站,都会在APP中发现GridView的使用。“Tiles”提供了一个简单易...

葡萄城控件技术团队
2015/10/20
101
0
『远山淡影』——逝去往昔的记忆拼图

远山淡影,书名就很有禅意,有种中国泼墨山水画的意境,不禁让人遐想。这是今年诺贝尔奖文学奖获得者石黑一雄出道的作品,也是我读的第一本他的书。 远山淡影封面 故事有两条线,一条线是悦子...

知猪侠_CD
2017/11/26
0
0

没有更多内容

加载失败,请刷新页面

加载更多

类比思想歪解Java线程

在操作系统的概念里,有内核态,用户态。其实,操作系统的最小执行单位是进程,而进程是分类型的,有两种类型,内核进程,用户进程。 内核进程由操作系统启动时创建,用户进程是由用户程序启...

萧默
49分钟前
2
0
Git推送错误“ [[远程拒绝]主机->主机(分支当前已签出)”)

昨天,我发布了一个有关如何将Git存储库从我的一台计算机克隆到另一台计算机的问题 , 如何从另一台计算机“ git clone”? 。 现在,我可以成功地将Git存储库从源(192.168.1.2)克隆到目标...

javail
59分钟前
4
0
Selenium 4.0 Alpha更新日志

早在2018年8月,整个测试自动化社区就发生了一件重大新闻:Selenium的创始成员Simon Stewart在班加罗尔Selenium会议上正式确认了Selenium 4的发布日期和一些重要更新。 Selenium 4.0 Alpha版...

八音弦
今天
7
0
2、编写程序求Sn=a+aa+aaa+…+aa…aa的值,其中a是1—9之间的一位数字,n表示 a的位数

//编写程序求Sn=a+aa+aaa+…+aa…aa的值,其中a是1-9之间的一位数字, //n表示 a的位数 #include<stdio.h> int main() { int a,n,i,Sn=0,Z=0; printf("please intput a:\n"); scanf("%d",&a......

201905021729吴建森
今天
5
0
Git中的HEAD是什么?

您会看到Git文档说出类似 分支必须在HEAD中完全合并。 但是到底什么是Git HEAD ? #1楼 了解正确答案的一种好方法是运行git reflog HEAD ,您可以获得HEAD所指向的所有位置的历史记录。 #2楼...

技术盛宴
今天
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部