UWP入门(八)--几个简单的控件
每天看几个,要不聊几天我就可以看完啦,加油!
看效果
1. CheckBox
<TextBlock Grid.Row="0" Text="CheckBox" VerticalAlignment="Center" />
<StackPanel Grid.Column="1"
Margin="20,10,0,10"
Orientation="Horizontal">
<CheckBox Name="MyCheckBox"
Content="Agree?"
Tapped="MyCheckBox_Tapped" />
<TextBlock Name="CheckBoxResultTextBlock" />
</StackPanel>
private void MyCheckBox_Tapped(object sender, TappedRoutedEventArgs e)
{
CheckBoxResultTextBlock.Text = MyCheckBox.IsChecked.ToString();
}
2. RadioButton
<TextBlock Grid.Row="2"
Text="RadioButton"
VerticalAlignment="Center" />
<StackPanel Grid.Row="2"
Grid.Column="1"
Orientation="Horizontal"
Margin="20,10,0,10">
<RadioButton Name="YesRadioButton"
Content="Yes"
GroupName="MyGroup"
Checked="RadioButton_Checked" />
<RadioButton Name="NoRadioButton"
Content="No"
GroupName="MyGroup"
Checked="RadioButton_Checked" />
<TextBlock Name="RadioButtonTextBlock" />
</StackPanel>
private void RadioButton_Checked(object sender, RoutedEventArgs e)
{
RadioButtonTextBlock.Text = (bool)YesRadioButton.IsChecked ? "Yes" : "No";
}
3. CombomBox
<TextBlock Grid.Row="3"
Text="ComboBox"
Name="MyComboBox"
VerticalAlignment="Center" />
<StackPanel Orientation="Horizontal"
Grid.Row="3"
Grid.Column="1"
Margin="20,10,0,10">
<ComboBox SelectionChanged="ComboBox_SelectionChanged" >
<ComboBoxItem Content="Fourth" />
<ComboBoxItem Content="Fifth" />
<ComboBoxItem Content="Sixth" IsSelected="True" />
</ComboBox>
<TextBlock Name="ComboBoxResultTextBlock" />
</StackPanel>
private void ComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
if (ComboBoxResultTextBlock == null) return;
var combo = (ComboBox)sender;
var item = (ComboBoxItem)combo.SelectedItem;
ComboBoxResultTextBlock.Text = item.Content.ToString();
}
4. ListBox
<TextBlock Grid.Row="4" Text="ListBox" VerticalAlignment="Center" />
<StackPanel Grid.Row="4" Grid.Column="1" Margin="20,10,0,10">
<ListBox Name="MyListBox"
SelectionMode="Multiple"
SelectionChanged="ListBox_SelectionChanged">
<ListBoxItem Content="First" />
<ListBoxItem Content="Second" />
<ListBoxItem Content="Third" />
</ListBox>
<TextBlock Name="ListBoxResultTextBlock" />
</StackPanel>
private void ListBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
var selectedItems = MyListBox.Items.Cast<ListBoxItem>()
.Where(p => p.IsSelected)
.Select(t => t.Content.ToString())
.ToArray();
ListBoxResultTextBlock.Text = string.Join(", ", selectedItems);
}
5. image
<TextBlock Grid.Row="5" Text="Image" VerticalAlignment="Center" />
<Image Source="Assets/StoreLogo.png"
HorizontalAlignment="Left"
Width="250"
Height="50"
Grid.Row="5"
Grid.Column="1"
Stretch="Uniform"
Margin="20,10,0,10" />
image 的四种拉伸方法
- None
- 不做任何处理,一般比较大
- Fill
- 占据所给的最大空间,比例会失调
- Uniform
- 按比例伸缩,占据所给的最大空间
- UniformFill
- 按比例伸缩,占据大小
6. 漂亮的 ToggleSwitch
<TextBlock Grid.Row="8"
Text="ToggleSwitch"
VerticalAlignment="Center" />
<StackPanel Grid.Row="8"
Grid.Column="1"
Margin="20,10,0,10" >
<ToggleSwitch>
<ToggleSwitch.OffContent>
<TextBlock Text="I'm off right now." />
</ToggleSwitch.OffContent>
<ToggleSwitch.OnContent>
<TextBlock Text="I'm on!" />
</ToggleSwitch.OnContent>
</ToggleSwitch>
</StackPanel>
不需要代码
7. ToggleButton
<TextBlock Grid.Row="7" Text="ToggleButton" VerticalAlignment="Center" />
<StackPanel Orientation="Horizontal"
Grid.Row="7"
Grid.Column="1"
Margin="20,10,0,10" >
<ToggleButton Name="MyToggleButton"
Content="Premium Option"
IsThreeState="True"
Click="MyToggleButton_Click" />
<TextBlock Name="ToggleButtonResultTextBlock" />
</StackPanel>
private void MyToggleButton_Click(object sender, RoutedEventArgs e)
{
ToggleButtonResultTextBlock.Text = MyToggleButton.IsChecked.ToString();
}
代码
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" Margin="10,10,0,0">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<TextBlock Grid.Row="0" Text="CheckBox" VerticalAlignment="Center" />
<StackPanel Grid.Column="1"
Margin="20,10,0,10"
Orientation="Horizontal">
<CheckBox Name="MyCheckBox"
Content="Agree?"
Tapped="MyCheckBox_Tapped" />
<TextBlock Name="CheckBoxResultTextBlock" />
</StackPanel>
<TextBlock Grid.Row="2"
Text="RadioButton"
VerticalAlignment="Center" />
<StackPanel Grid.Row="2"
Grid.Column="1"
Orientation="Horizontal"
Margin="20,10,0,10">
<RadioButton Name="YesRadioButton"
Content="Yes"
GroupName="MyGroup"
Checked="RadioButton_Checked" />
<RadioButton Name="NoRadioButton"
Content="No"
GroupName="MyGroup"
Checked="RadioButton_Checked" />
<TextBlock Name="RadioButtonTextBlock" />
</StackPanel>
<TextBlock Grid.Row="3"
Text="ComboBox"
Name="MyComboBox"
VerticalAlignment="Center" />
<StackPanel Orientation="Horizontal"
Grid.Row="3"
Grid.Column="1"
Margin="20,10,0,10">
<ComboBox SelectionChanged="ComboBox_SelectionChanged" >
<ComboBoxItem Content="Fourth" />
<ComboBoxItem Content="Fifth" />
<ComboBoxItem Content="Sixth" IsSelected="True" />
</ComboBox>
<TextBlock Name="ComboBoxResultTextBlock" />
</StackPanel>
<TextBlock Grid.Row="4" Text="ListBox" VerticalAlignment="Center" />
<StackPanel Grid.Row="4" Grid.Column="1" Margin="20,10,0,10">
<ListBox Name="MyListBox"
SelectionMode="Multiple"
SelectionChanged="ListBox_SelectionChanged">
<ListBoxItem Content="First" />
<ListBoxItem Content="Second" />
<ListBoxItem Content="Third" />
</ListBox>
<TextBlock Name="ListBoxResultTextBlock" />
</StackPanel>
<TextBlock Grid.Row="5" Text="Image" VerticalAlignment="Center" />
<Image Source="Assets/StoreLogo.png"
HorizontalAlignment="Left"
Width="250"
Height="50"
Grid.Row="5"
Grid.Column="1"
Stretch="Uniform"
Margin="20,10,0,10" />
<TextBlock Grid.Row="7" Text="ToggleButton" VerticalAlignment="Center" />
<StackPanel Orientation="Horizontal"
Grid.Row="7"
Grid.Column="1"
Margin="20,10,0,10" >
<ToggleButton Name="MyToggleButton"
Content="Premium Option"
IsThreeState="True"
Click="MyToggleButton_Click" />
<TextBlock Name="ToggleButtonResultTextBlock" />
</StackPanel>
<TextBlock Grid.Row="8"
Text="ToggleSwitch"
VerticalAlignment="Center" />
<StackPanel Grid.Row="8"
Grid.Column="1"
Margin="20,10,0,10" >
<ToggleSwitch>
<ToggleSwitch.OffContent>
<TextBlock Text="I'm off right now." />
</ToggleSwitch.OffContent>
<ToggleSwitch.OnContent>
<TextBlock Text="I'm on!" />
</ToggleSwitch.OnContent>
</ToggleSwitch>
</StackPanel>
</Grid>
cs 代码
public sealed partial class MainPage : Page
{
public MainPage()
{
this.InitializeComponent();
}
private void MyCheckBox_Tapped(object sender, TappedRoutedEventArgs e)
{
CheckBoxResultTextBlock.Text = MyCheckBox.IsChecked.ToString();
}
private void RadioButton_Checked(object sender, RoutedEventArgs e)
{
RadioButtonTextBlock.Text = (bool)YesRadioButton.IsChecked ? "Yes" : "No";
}
private void ComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
if (ComboBoxResultTextBlock == null) return;
var combo = (ComboBox)sender;
var item = (ComboBoxItem)combo.SelectedItem;
ComboBoxResultTextBlock.Text = item.Content.ToString();
}
private void ListBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
var selectedItems = MyListBox.Items.Cast<ListBoxItem>()
.Where(p => p.IsSelected)
.Select(t => t.Content.ToString())
.ToArray();
ListBoxResultTextBlock.Text = string.Join(", ", selectedItems);
}
private void MyToggleButton_Click(object sender, RoutedEventArgs e)
{
ToggleButtonResultTextBlock.Text = MyToggleButton.IsChecked.ToString();
}
}
UWP入门(八)--几个简单的控件的更多相关文章
- (八)ASP.NET自定义用户控件(1)
http://blog.csdn.net/laodao1/article/details/5897366 ASP.NET自定义控件组件开发 第一章:从一个简单的控件谈起 起始开发ASP.NET自定义控 ...
- ASP.NET自定义控件组件开发 第一章 第一章:从一个简单的控件谈起
第一章:从一个简单的控件谈起 系列文章链接: ASP.NET自定义控件组件开发 第一章 待续 ASP.NET自定义控件组件开发 第一章 第二篇 接着待续 ASP.NET自定义控件组件开发 第一章 第三 ...
- [译]Kinect for Windows SDK开发入门(十八):Kinect Interaction交互控件
本文译自 http://dotneteers.net/blogs/vbandi/archive/2013/03/25/kinect-interactions-with-wpf-part-i-getti ...
- UWP &WP8.1 依赖属性和用户控件 依赖属性简单使用 uwp添加UserControl
上面说 附加属性.这章节说依赖属性. 所谓依赖属性.白话讲就是添加一个公开的属性. 同样,依赖属性的用法和附加属性的用法差不多. 依赖属性是具有一个get,set的属性,以及反调函数. 首先是声明依赖 ...
- VS2010/MFC编程入门之二十三(常用控件:按钮控件的编程实例)
上一节VS2010/MFC编程入门教程中鸡啄米讲了按钮控件Button.Radio Button和Check Box的基本用法,本节就继续讲按钮控件的内容,通过一个实例让大家更清楚按钮控件在实际的软件 ...
- duilib教程之duilib入门简明教程15.自绘控件
在[2013 duilib入门简明教程 -- 复杂控件介绍 (13)]中虽然介绍了界面设计器上的所有控件,但是还有一些控件并没有被放到界面设计器上,还有一些常用控件duilib并没有提供(比如菜单控件 ...
- UWP开发必备:常用数据列表控件汇总比较
今天是想通过实例将UWP开发常用的数据列表做汇总比较,作为以后项目开发参考.UWP开发必备知识点总结请参照[UWP开发必备以及常用知识点总结]. 本次主要讨论以下控件: GridView:用于显示数据 ...
- Android入门(六):Android控件布局属性全解
第一类:属性值为true或falseandroid:layout_centerHrizontal 水平居中 (Hrizontal表示水平)android:layout_centerVertical 垂 ...
- MFC编程入门之二十七(常用控件:图片控件PictureControl)
上一节讲的是滚动条控件,本节主要讲一种简单实用的控件,图片控件Picture Control.我们可以在界面某个位置放入图片控件,显示图片以美化界面. 图片控件简介 图片控件和前面讲到的静态文本框都是 ...
随机推荐
- Javascript中的DOM实现显示鼠标的空间位置
为了显示鼠标相对于浏览器的位置(相对于屏幕和页面类似),我们能够利用click事件,获得关于鼠标单击的事件对象event.这个事件对象里的clientX和clientY包括了鼠标的位置信息,所以我突发 ...
- [SVG] Add an SVG as an Embedded Background Image
Learn how to set an elements background image to embedded SVG. This method has an added benefit of n ...
- html常用属性border-radius、linear-gradient怎么使用
html常用属性border-radius.linear-gradient怎么使用 一.总结 一句话总结: 1.border-radius: 8px 8px 8px 8px !important; 2 ...
- Erlang 命令行监控工具
http://www.cnblogs.com/me-sa/archive/2012/11/22/erlang_vm_monitor_text_mode.html 之前介绍过一个Erlang的Web监控 ...
- C# 直接创建多个类和使用反射创建类的性能
原文:C# 直接创建多个类和使用反射创建类的性能 本文告诉大家我对比的使用直接创建多个类和使用反射创建多个类的性能 在上一篇 C# 程序内的类数量对程序启动的影响 的基础上,继续做实验 现在创建 10 ...
- Jsp bug_001
报错: The superclass "javax.servlet.http.HttpServlet" was not found on the Java Build Path 解 ...
- Cocos2dx 温馨提示(十)三种缓存类演示
在介绍了三级缓存,首先,我们必须弄清楚的一个问题:什么是纹理?它的通俗的解释,质感是它的含义的图片. 当图像加载到内存中后,,它是存在于纹理的形式.由于从这里可以看出.纹理事实上就是一块内存.这块内存 ...
- 1 Task的简单实用
Task是thread和threadpool两者结合的产物,吸收了二者的优点 进一步添加了一些新的 优秀的功能. using System; using System.Threading.Tasks ...
- 1.开始第一个MVC项目
安装就不说了 1.在指定路径创建好项目文件夹之后,打开cmd,进去这个文件夹路径下 输入命令 dotnet new mvc 就会在文件夹内创建一个mvc项目 2.创建好项目之后 直接在这个路径下输入 ...
- 3D场景中的鼠标响应事件
原文:3D场景中的鼠标响应事件 今天要讲的是3D场景中的鼠标响应事件的处理,首先Button的响应是大家熟知的,只要加上一个click事件,然后写一个响应的处理时间就行了.对于二维平面上的一些控件也很 ...