在 UWP 中不渲染 PNG 文件时扼杀错误
Strangle bug while not render PNG file in UWP
这里是 XAML:
<Page
x:Class="App1.InputBoxPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:App1"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid>
<Rectangle Fill="Black" Opacity="1"></Rectangle>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="0.3*"></RowDefinition>
<RowDefinition Height="0.4*"></RowDefinition>
<RowDefinition Height="0.3*"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.3*"></ColumnDefinition>
<ColumnDefinition Width="0.4*"></ColumnDefinition>
<ColumnDefinition Width="0.3*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid Grid.Column="1" Grid.Row="1">
<Grid.RowDefinitions>
<RowDefinition Height="0.7*"></RowDefinition>
<RowDefinition Height="0.1*"></RowDefinition>
<RowDefinition Height="0.2*"></RowDefinition>
</Grid.RowDefinitions>
<Image Source="/Image/MessageBox.png" VerticalAlignment="Top"></Image>
<Grid Grid.Row="2">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.1*"></ColumnDefinition>
<ColumnDefinition Width="0.3*"></ColumnDefinition>
<ColumnDefinition Width="0.2*"></ColumnDefinition>
<ColumnDefinition Width="0.3*"></ColumnDefinition>
<ColumnDefinition Width="0.1*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Button Grid.Column="1" Content="OK" IsTabStop="False" HorizontalAlignment="Center" Name="InputBoxButtonYes">
<Button.Template>
<ControlTemplate>
<Grid Name="G">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal">
<VisualState.Setters>
</VisualState.Setters>
</VisualState>
<VisualState x:Name="PointerOver">
<VisualState.Setters>
<Setter Value="0.8" Target="G.Opacity"></Setter>
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Image Source="/Image/MessageBoxButton.png"></Image>
<ContentPresenter FontSize="20" Foreground="#37f4ff" VerticalContentAlignment="Center" HorizontalContentAlignment="Center"></ContentPresenter>
</Grid>
</ControlTemplate>
</Button.Template>
</Button>
<Button Grid.Column="3" Content="Cancel" IsTabStop="False" HorizontalAlignment="Center" Name="InputBoxButtonNo">
<Button.Template>
<ControlTemplate>
<Grid Name="G">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal">
<VisualState.Setters>
</VisualState.Setters>
</VisualState>
<VisualState x:Name="PointerOver">
<VisualState.Setters>
<Setter Value="0.8" Target="G.Opacity"></Setter>
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Image Source="/Image/MessageBoxButton.png" RenderTransformOrigin="0.5,0.5">
<Image.RenderTransform>
<ScaleTransform ScaleX="-1"></ScaleTransform>
</Image.RenderTransform>
</Image>
<ContentPresenter FontSize="20" Foreground="#37f4ff" VerticalContentAlignment="Center" HorizontalContentAlignment="Center"></ContentPresenter>
</Grid>
</ControlTemplate>
</Button.Template>
</Button>
</Grid>
<Grid>
<Grid.RowDefinitions>
<RowDefinition></RowDefinition>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.2*"></ColumnDefinition>
<ColumnDefinition Width="0.6*"></ColumnDefinition>
<ColumnDefinition Width="0.2*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<TextBox Foreground="#FF37F4FF" Name="InputBoxContent" Background="#00FF0000" Grid.Column="1" HorizontalAlignment="Stretch" VerticalAlignment="Center" TextAlignment="Center" FontSize="15" BorderThickness="0,0,0,2" BorderBrush="#FF37F4FF" Template="{StaticResource TextBoxControlTemplate}"></TextBox>
<TextBlock Foreground="#17f98a" Name="InputBoxTitle" Grid.Column="1" Grid.Row="1" HorizontalAlignment="Center" VerticalAlignment="Center" TextWrapping="Wrap" FontSize="20" TextAlignment="Center">Input your code</TextBlock>
<!--<TextBox Grid.Column="1" Name="InputBoxContent"></TextBox>-->
</Grid>
</Grid>
</Grid>
</Grid>
</Page>
如上我新建了一个页面
运行起来是这样的:
如您所见,取消按钮的 png 没有渲染。
但是,当我调整 window 的大小时,取消的 png 成功呈现如下:
同时,我发现这个bug没有规律,有时它会正确渲染,有时它不会像我上面说的那样渲染,直到调整window。
这有什么问题吗?我都快疯了,我什至知道这是什么诅咒。
我按照@Johnny Westlake 所说的那样做了,删除了-1 Scale Render T运行sform 并使用Photoshop 翻转图像然后将其添加到prject。
搞了好几次运行,bug就没了
看来真的是UWP有bug,微软到现在也没修复
首先也是最后,感谢@Johnny Westlake 的帮助。
谢谢。
这里是 XAML:
<Page
x:Class="App1.InputBoxPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:App1"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid>
<Rectangle Fill="Black" Opacity="1"></Rectangle>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="0.3*"></RowDefinition>
<RowDefinition Height="0.4*"></RowDefinition>
<RowDefinition Height="0.3*"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.3*"></ColumnDefinition>
<ColumnDefinition Width="0.4*"></ColumnDefinition>
<ColumnDefinition Width="0.3*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid Grid.Column="1" Grid.Row="1">
<Grid.RowDefinitions>
<RowDefinition Height="0.7*"></RowDefinition>
<RowDefinition Height="0.1*"></RowDefinition>
<RowDefinition Height="0.2*"></RowDefinition>
</Grid.RowDefinitions>
<Image Source="/Image/MessageBox.png" VerticalAlignment="Top"></Image>
<Grid Grid.Row="2">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.1*"></ColumnDefinition>
<ColumnDefinition Width="0.3*"></ColumnDefinition>
<ColumnDefinition Width="0.2*"></ColumnDefinition>
<ColumnDefinition Width="0.3*"></ColumnDefinition>
<ColumnDefinition Width="0.1*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Button Grid.Column="1" Content="OK" IsTabStop="False" HorizontalAlignment="Center" Name="InputBoxButtonYes">
<Button.Template>
<ControlTemplate>
<Grid Name="G">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal">
<VisualState.Setters>
</VisualState.Setters>
</VisualState>
<VisualState x:Name="PointerOver">
<VisualState.Setters>
<Setter Value="0.8" Target="G.Opacity"></Setter>
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Image Source="/Image/MessageBoxButton.png"></Image>
<ContentPresenter FontSize="20" Foreground="#37f4ff" VerticalContentAlignment="Center" HorizontalContentAlignment="Center"></ContentPresenter>
</Grid>
</ControlTemplate>
</Button.Template>
</Button>
<Button Grid.Column="3" Content="Cancel" IsTabStop="False" HorizontalAlignment="Center" Name="InputBoxButtonNo">
<Button.Template>
<ControlTemplate>
<Grid Name="G">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal">
<VisualState.Setters>
</VisualState.Setters>
</VisualState>
<VisualState x:Name="PointerOver">
<VisualState.Setters>
<Setter Value="0.8" Target="G.Opacity"></Setter>
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Image Source="/Image/MessageBoxButton.png" RenderTransformOrigin="0.5,0.5">
<Image.RenderTransform>
<ScaleTransform ScaleX="-1"></ScaleTransform>
</Image.RenderTransform>
</Image>
<ContentPresenter FontSize="20" Foreground="#37f4ff" VerticalContentAlignment="Center" HorizontalContentAlignment="Center"></ContentPresenter>
</Grid>
</ControlTemplate>
</Button.Template>
</Button>
</Grid>
<Grid>
<Grid.RowDefinitions>
<RowDefinition></RowDefinition>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.2*"></ColumnDefinition>
<ColumnDefinition Width="0.6*"></ColumnDefinition>
<ColumnDefinition Width="0.2*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<TextBox Foreground="#FF37F4FF" Name="InputBoxContent" Background="#00FF0000" Grid.Column="1" HorizontalAlignment="Stretch" VerticalAlignment="Center" TextAlignment="Center" FontSize="15" BorderThickness="0,0,0,2" BorderBrush="#FF37F4FF" Template="{StaticResource TextBoxControlTemplate}"></TextBox>
<TextBlock Foreground="#17f98a" Name="InputBoxTitle" Grid.Column="1" Grid.Row="1" HorizontalAlignment="Center" VerticalAlignment="Center" TextWrapping="Wrap" FontSize="20" TextAlignment="Center">Input your code</TextBlock>
<!--<TextBox Grid.Column="1" Name="InputBoxContent"></TextBox>-->
</Grid>
</Grid>
</Grid>
</Grid>
</Page>
如上我新建了一个页面
运行起来是这样的:
如您所见,取消按钮的 png 没有渲染。
但是,当我调整 window 的大小时,取消的 png 成功呈现如下:
同时,我发现这个bug没有规律,有时它会正确渲染,有时它不会像我上面说的那样渲染,直到调整window。
这有什么问题吗?我都快疯了,我什至知道这是什么诅咒。
我按照@Johnny Westlake 所说的那样做了,删除了-1 Scale Render T运行sform 并使用Photoshop 翻转图像然后将其添加到prject。
搞了好几次运行,bug就没了
看来真的是UWP有bug,微软到现在也没修复
首先也是最后,感谢@Johnny Westlake 的帮助。
谢谢。