c# - 如何使uwp弹出全屏
问题描述
我正在为平板电脑创建一个应用程序,它将显示一个充满数据的网格。我希望能够单击每个项目,然后将该数据显示在弹出窗口或弹出窗口或其他对话框中,以便我可以像表单一样对其进行编辑。到目前为止,我正在使用一个包含堆栈面板的弹出窗口,如下所示:
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" Margin="10 0 10 0">
<GridView ItemsSource="{x:Bind Activities}" ItemsPanel="{StaticResource ResourceKey=ItemsPanelTemplate}">
<GridView.ItemContainerStyle>
<Style TargetType="GridViewItem">
<Setter Property="HorizontalContentAlignment" Value="Stretch" />
</Style>
</GridView.ItemContainerStyle>
<GridView.ItemTemplate>
<DataTemplate x:DataType="model:TimActivity">
<Grid Tapped="GridView_Tapped">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*" />
<ColumnDefinition Width="1*" />
<ColumnDefinition Width="1*" />
<ColumnDefinition Width="1*" />
<ColumnDefinition Width="1*" />
<ColumnDefinition Width="2*" />
<ColumnDefinition Width="1*" />
</Grid.ColumnDefinitions>
<TextBlock Grid.Column="0" Text="{x:Bind Path=Type, Converter={StaticResource TimActivityTypeToStringConverter}}" />
<TextBlock Grid.Column="1" Text="{x:Bind StartTime}" />
<TextBlock Grid.Column="2" Text="{x:Bind EndTime}" />
<TextBlock Grid.Column="3" Text="{x:Bind From}" />
<TextBlock Grid.Column="4" Text="{x:Bind To}" />
<TextBlock Grid.Column="5" Text="{x:Bind Comment}" />
<TextBlock Grid.Column="6" Text="{x:Bind Path=Chargeable, Converter={StaticResource BoolToStringConverter}}" />
<FlyoutBase.AttachedFlyout>
<Flyout Placement="Full">
<StackPanel>
<TextBlock Text="Activity"/>
<TextBox Text="{x:Bind Path=Type, Converter={StaticResource TimActivityTypeToStringConverter}}" />
<TextBlock Text="Start Time"/>
<TextBox Text="{x:Bind StartTime}" />
<TextBlock Text="End Time"/>
<TextBox Text="{x:Bind EndTime}" />
<TextBlock Text="From"/>
<TextBox Text="{x:Bind From}" />
<TextBlock Text="To"/>
<TextBox Text="{x:Bind To}" />
<TextBlock Text="Comment"/>
<TextBox Text="{x:Bind Comment}" />
<TextBlock Text="Chargeable?"/>
<TextBox Text="{x:Bind Path=Chargeable, Converter={StaticResource BoolToStringConverter}}" />
</StackPanel>
</Flyout>
</FlyoutBase.AttachedFlyout>
</Grid>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
</Grid>
我将 设置Placement
为Full
,但它只会垂直拉伸弹出窗口,而不是全屏。你能告诉我一个。弹出是对此的正确控制,并且b。如何让它全屏?
解决方案
对于您的要求,我们建议您使用ConnectedAnimation
方法。有关更多步骤,请参阅此代码示例。
private void TipsGrid_ItemClick(object sender, ItemClickEventArgs e)
{
ConnectedAnimation animation = null;
// Get the collection item corresponding to the clicked item.
var container = collection.ContainerFromItem(e.ClickedItem) as GridViewItem;
if (container != null)
{
// Stash the clicked item for use later. We'll need it when we connect back from the detailpage.
_storedItem = Convert.ToInt32(container.Content);
// Prepare the connected animation.
// Notice that the stored item is passed in, as well as the name of the connected element.
// The animation will actually start on the Detailed info page.
animation = collection.PrepareConnectedAnimation("forwardAnimation", _storedItem, "connectedElement");
}
SmokeGrid.Visibility = Visibility.Visible;
// SmokeGrid.DataContext = e.ClickedItem;
animation.TryStart(destinationElement);
}
更新
然后我应该能够编辑该表单中的所有字段,保存后,它会反映在网格中。
您可以创建继承模型INotifyPropertyChanged
,然后使用双向绑定将模型属性与 xaml 代码绑定。
<GridView Name="collection" ItemClick="Conllection_ItemClick" IsItemClickEnabled="True">
<GridView.ItemTemplate>
<DataTemplate>
<Grid x:Name="connectedElement" Height="100" Width="100" Background="Orange">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<TextBlock Text="{Binding Title}"
VerticalAlignment="Center"
HorizontalAlignment="Center"
TextAlignment="Center"/>
<TextBlock Grid.Row="1" Text="{Binding Content,Mode=TwoWay}"
VerticalAlignment="Center"
HorizontalAlignment="Center"
TextAlignment="Center"/>
</Grid>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
GridView
您可以在ItemClick时将项目传递给弹出网格。
private void Conllection_ItemClick(object sender, ItemClickEventArgs e)
{
ConnectedAnimation animation = null;
var container = collection.ContainerFromItem(e.ClickedItem) as GridViewItem;
if(container != null)
{
_storedItem = container.Content;
animation = collection.PrepareConnectedAnimation("forwardAnimation", _storedItem, "connectedElement");
}
SmokeGrid.Visibility = Visibility.Visible;
// pass the item DataContext.
SmokeGrid.DataContext = e.ClickedItem;
animation.TryStart(destinationElement);
}
迷你样本已更新,您可以参考。
推荐阅读
- elixir - Elixir:更新地图列表
- ms-word - Word 查找和替换:搜索任何月份
- javascript - Javascript单击事件触发在C#的控制台中打印
- python-3.x - 将字典转换为 Pandas 数据框
- pari - pari gp函数编程中的指针可选参数
- javascript - ThreeJS在链接方法时将位置偏移量添加到Matrix4
- windows - 一定时间后批量关闭并重启进程
- xcode - 如何修复多个 SwiftUI 预览
- python - 如何使用 Selenium 在表单上输入登录凭据
- floating-point - 如何计算或估计特定数字的浮点舍入误差