В WinRT api, как принять ввод пользователя в диалоговом окне, как в приложениях "Погода и финансы"
Я пытаюсь отобразить диалоговое окно, которое позволяет пользователю вводить местоположение, как в функции "добавить места" приложения Weather в Windows 8.
Пространство имен Windows.UI.Popups не имеет соответствующего элемента управления. У него есть MessageDialog, но я не думаю, что его можно настроить, чтобы включить в него текстовое поле.
Нужно ли использовать Windows.UI.XAML.Controls.Primitives.Popup для управления каким-либо образом?
![The input dialog in Weather App on Windows 8]()
Ответы
Ответ 1
Для обработки этого стиля пользовательского интерфейса отсутствует контроль над ядром вне окна, библиотека Callisto использует этот элемент управления довольно немного, поэтому у него есть много хороших примеров использования.
Изменить: Фактически теперь библиотека Callisto имеет элемент управления CustomDialog, который поможет вам сделать именно это.
Ответ 2
Да, вы можете использовать элемент управления Popup, но вам нужно установить дочернее свойство в элемент управления содержимым, который охватывает полное окно приложения И изменяет размер при изменении размера окна. Нетрудно создать свой собственный.
Создайте Templated Control на основе ContentControl:
public sealed class PopoverView : ContentControl
{
public PopoverView()
{
this.DefaultStyleKey = typeof(PopoverView);
Loaded += OnLoaded;
Unloaded += OnUnloaded;
}
/// <summary>
/// Measure the size of this control: make it cover the full App window
/// </summary>
protected override Size MeasureOverride(Size availableSize)
{
Rect bounds = Window.Current.Bounds;
availableSize = new Size(bounds.Width, bounds.Height);
base.MeasureOverride(availableSize);
return availableSize;
}
private void OnLoaded(object sender, RoutedEventArgs e)
{
Window.Current.SizeChanged += OnSizeChanged;
}
private void OnSizeChanged(object sender, WindowSizeChangedEventArgs e)
{
InvalidateMeasure();
}
private void OnUnloaded(object sender, RoutedEventArgs e)
{
Window.Current.SizeChanged -= OnSizeChanged;
}
}
Добавьте этот код в Generic.xaml:
<SolidColorBrush x:Key="PopoverViewBackgroundThemeBrush">White</SolidColorBrush>
<!-- Semi-transparant black brush to cover the background: -->
<SolidColorBrush x:Key="PopoverViewOverlayThemeBrush">#80000000</SolidColorBrush>
<Style TargetType="local:PopoverView">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="local:PopoverView">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Border Grid.Row="0" Background="{StaticResource PopoverViewOverlayThemeBrush}" />
<Border Grid.Row="1" Child="{TemplateBinding Content}" Background="{StaticResource PopoverViewBackgroundThemeBrush}" />
<Border Grid.Row="2" Background="{StaticResource PopoverViewOverlayThemeBrush}" />
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Теперь вы можете создать UserControl с PopoverView в качестве контента. Пример:
<UserControl
x:Class="PopoverCustomControlTest.MyUserControl1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:PopoverCustomControlTest"
xmlns:custom="using:MyCustomControls"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<custom:PopoverView>
<!-- Create your own dialog here instead of this simple button -->
<Button Content="Close PopoverView"
Click="Button_Click_1"
Background="Black"
HorizontalAlignment="Center"
Margin="40" />
</custom:PopoverView>
</UserControl>
public sealed partial class MyUserControl1 : UserControl
{
private Popup popup;
public MyUserControl1(Popup popup)
{
if (popup == null) throw new ArgumentNullException("popup");
this.popup = popup;
this.InitializeComponent();
}
private void Button_Click_1(object sender, RoutedEventArgs e)
{
this.popup.IsOpen = false;
}
}
И покажите его, когда вам это нужно:
Popup popup = new Popup();
popup.Child = new MyUserControl1(popup);
popup.IsOpen = true;
Ответ 3
Вы не можете смешивать и сопоставлять элементы управления XAML с использованием приложения html.
Вы можете либо построить свой собственный диалоговый элемент управления со всем, что он влечет за собой (фокус сложный!), или я бы рекомендовал использовать WinJS.UI.Flyout и связанные с ним элементы управления. Вот несколько рекомендаций:
http://msdn.microsoft.com/en-us/library/windows/apps/hh465341.aspx
Вы должны уметь стилизовать его по своему усмотрению.