UWP自动填充控件AutoSuggestBox小优化
UWP提供的AutoSuggestBox本身非常好用,在项目中经常用到,但是当我们使用时发现一下不人性化的设置,例子1如下:
<Page
x:Class="SelfInkCanvas.AutoBoxTest"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:SelfInkCanvas"
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}">
<AutoSuggestBox x:Name="autoSuggestBox"
PlaceholderText="输入一个字符"
TextChanged="autoSuggestBox_TextChanged"
SuggestionChosen="autoSuggestBox_SuggestionChosen"
QuerySubmitted="autoSuggestBox_QuerySubmitted"
></AutoSuggestBox>
</Grid>
</Page>
AutoBoxTest.xaml
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
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=234238 上有介绍 namespace SelfInkCanvas
{
/// <summary>
/// 可用于自身或导航至 Frame 内部的空白页。
/// </summary>
public sealed partial class AutoBoxTest : Page
{
private ObservableCollection<String> suggestions;
public AutoBoxTest()
{
suggestions = new ObservableCollection<string>();
this.InitializeComponent();
} private void autoSuggestBox_TextChanged(AutoSuggestBox sender, AutoSuggestBoxTextChangedEventArgs args)
{
suggestions.Clear();
suggestions.Add(sender.Text + "");
suggestions.Add(sender.Text + "");
suggestions.Add(sender.Text + "");
suggestions.Add(sender.Text + "");
suggestions.Add(sender.Text + "");
sender.ItemsSource = suggestions; } private void autoSuggestBox_QuerySubmitted(AutoSuggestBox sender, AutoSuggestBoxQuerySubmittedEventArgs args)
{ } private void autoSuggestBox_SuggestionChosen(AutoSuggestBox sender, AutoSuggestBoxSuggestionChosenEventArgs args)
{
}
}
}
AutoBoxTest.xaml.cs
当我们输入字符,查找后在输入框会有相应的补充的选项在下面,当我们使用键盘的”↑“和“↓”去选择选项的时候,会发现我们选不了第3项的选项,应为当我们在选择第一个选项的时候,我们发现在我们的输入框中的字符已经变化为选项的内容,这时又会触发autoSuggestBox_TextChanged事件,重新渲染下拉选项,这对于我们使用键盘操作来说是一个不正确的选项。
所以要求我们的AutoSuggestBox控件在我们选择的时候不会在触发autoSuggestBox_TextChanged事件,只有当我们完成后在使用,因此我们需要对autoSuggestBox_TextChanged事件做一下相应的控制处理。需要明白,当我们选中选项的时候会触发autoSuggestBox_SuggestionChosen事件,而且是每一行多会触发。
因此我们优化后台代码如下:
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
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=234238 上有介绍 namespace SelfInkCanvas
{
/// <summary>
/// 可用于自身或导航至 Frame 内部的空白页。
/// </summary>
public sealed partial class AutoBoxTest : Page
{
private ObservableCollection<String> suggestions;
bool isChoose = false;
public AutoBoxTest()
{
suggestions = new ObservableCollection<string>();
this.InitializeComponent();
} private void autoSuggestBox_TextChanged(AutoSuggestBox sender, AutoSuggestBoxTextChangedEventArgs args)
{
if (!isChoose)
{
suggestions.Clear();
suggestions.Add(sender.Text + "");
suggestions.Add(sender.Text + "");
suggestions.Add(sender.Text + "");
suggestions.Add(sender.Text + "");
suggestions.Add(sender.Text + "");
sender.ItemsSource = suggestions;
}
isChoose = false;
} private void autoSuggestBox_QuerySubmitted(AutoSuggestBox sender, AutoSuggestBoxQuerySubmittedEventArgs args)
{ } private void autoSuggestBox_SuggestionChosen(AutoSuggestBox sender, AutoSuggestBoxSuggestionChosenEventArgs args)
{
isChoose = true;
}
}
}
AutoBoxTest.xaml.cs
UWP自动填充控件AutoSuggestBox小优化的更多相关文章
- JQuery自动填充控件:autocomplete(自己稍作了修改)
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 与众不同 windows phone (52) - 8.1 新增控件: AutoSuggestBox, ListView, GridView, SemanticZoom
[源码下载] 与众不同 windows phone (52) - 8.1 新增控件: AutoSuggestBox, ListView, GridView, SemanticZoom 作者:webab ...
- UWP 用Thumb 控件仿制一个可拖动悬浮 Button
参考了 http://www.cnblogs.com/zhanggaoxing/p/6403430.html,并加以改进. 最终效果::: Thumb 的原生事件 DragStarted,DragDe ...
- Android 开源组件 ----- Android LoopView无限自动轮转控件
Android 开源组件 ----- Android LoopView无限自动轮转控件 2015-12-28 15:26 by 杰瑞教育, 32 阅读, 0 评论, 收藏, 编辑 一.组件介绍 App ...
- js进阶 9-10 html控件如何实现点击自动选择控件内容
js进阶 9-10 html控件如何实现点击自动选择控件内容 一.总结 一句话总结: 1.在click事件中,如果focus,那就select 2.blur 1.html中控件添加两种方式? 在表单 ...
- QRowTable表格控件(三)-效率优化之-合理使用QStandardItem
目录 一.开心一刻 二.概述 三.效果展示 四.QStandardItem 1.QStandardItem是什么鬼 2.性能分析 3.QStandardItem使用上的坑 五.相关文章 原文链接:QR ...
- QRowTable表格控件(四)-效率优化之-优化数据源
目录 一.开心一刻 二.问题分析 三.重写数据源 1.自己存储数据 2.重写data接口 四.比较 五.相关文章 原文链接:QRowTable表格控件(四)-效率优化之-优化数据源 一.开心一刻 一程 ...
- CStatic中保持图形比例不变,尽量填充控件空间的代码
CStatic中保持图形比例不变,尽量填充控件空间的代码 先获取控件的高.宽,然后获取图像的高.宽,测试需要调整高还是调整宽 void CImagePreviewStatic::DrawItem(LP ...
- UWP 播放媒体控件
最近我的uwp需要有一个有声朗读的功能,like this 点击声音按钮就可以有声朗读了.这里主要是用了媒体播放的控件. 一般我们把需求分为两种: 一种是不需要呈现播放器的样子,只需要用户点击一下别的 ...
随机推荐
- java对象转换成json
package com.bjs.acrosstime.utils; import java.util.ArrayList; import java.util.Date; import java.uti ...
- linux系统swappiness参数在内存与交换分区间优化
http://blog.itpub.net/29371470/viewspace-1250975 swappiness的值的大小对如何使用swap分区是有着很大的联系的.swappine ...
- 毕业论文中使用的技术—FileReader接口
用来把文件读入内存,并且读取文件中的数据. FileReader接口提供了一个异步API,使用该API可以在浏览器主线程中异步访问文件系统,读取文件中的数据 FileReader接口的方法 方法名 参 ...
- codevs1048 石子合并
题目链接:http://codevs.cn/problem/1048/ 题目描述 Description 有n堆石子排成一列,每堆石子有一个重量w[i], 每次合并可以合并相邻的两堆石子,一次合并的代 ...
- python学习4 常用内置模块
logging os 路径处理 // 获取当前路径 os.path.abspath(__file__) //获取当前文件夹路径 os.path.dirname(os.path.abspath(__fi ...
- 如何理解typedef void (*pfun)(void)
问题: 在刚接触typedef void (*pfun)(void) 这个结构的时候,存在疑惑,为什么typedef后只有一"块"东西,而不是两"块"东西呢?那 ...
- unity 利用ugui 制作技能冷却效果
using System.Collections; using System.Collections.Generic; using UnityEngine; using UnityEngine.UI; ...
- jQuery Ajax请求(关于火狐下SyntaxError: missing ] after element list ajax返回json,var json = eval("("+data+")"); 报错)
$.ajax({ contentType: "application/x-www-form-urlencoded;charset=UTF-8" , type: &quo ...
- c# http get请求与post请求实例
//http请求工具类 using System;using System.Collections.Generic;using System.IO;using System.Linq;using Sy ...
- 二、JSP、servlet、SQL三者之间的数据传递(前台与后台数据交互)
2.收信息来到表单提交时URL所指向的servlet文件,获取传递过来的参数值