我正在开发将被显示在全高清液晶屏(42英寸)的WPF应用程序。 此外,我需要适应绝对位置的控制。 在开发环境中我看不到长1920×1080的窗口(这是有针对性的屏幕固定的分辨率)。
什么是完成这个任务的最佳做法是什么?
我正在开发将被显示在全高清液晶屏(42英寸)的WPF应用程序。 此外,我需要适应绝对位置的控制。 在开发环境中我看不到长1920×1080的窗口(这是有针对性的屏幕固定的分辨率)。
什么是完成这个任务的最佳做法是什么?
WPF使用设备无关单位用于指定宽度/高度/位置/厚度等
1 DIU / DIP当屏幕DPI被设置为96DPI .....但1 = DIU不同数目的物理像素的当DPI不是96DPI = 1个物理像素。
如果您使用Canvas
则使用DIUS定位元素。
现在你暗示要在像素坐标来进行绝对定位。
因此随着这样做Canvas
,无论现在的DPI设置是什么,你必须使用一个技巧缩放(你可以用做ViewBox
,或LayoutTransform
)。
下面的例子显示了一个方法去实现它(我的屏幕是1366×768 ....你可以把它改成全高清)。
它着眼于系统的DPI,并得到Canvas
缩小每当DPI上升。 这使您可以使用画布坐标,真正的意思是像素COORDS。
如果你能够改变用户屏幕到96DPI那么就没有必要做缩放伎俩,因为1 DIU = 1个在96DPI物理像素...没有缩放需要。
<Window x:Class="WpfApplication12.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
WindowStyle="None"
AllowsTransparency="True" Background="White"
SizeToContent="WidthAndHeight"
Title="MainWindow" Loaded="Window_Loaded">
<Viewbox x:Name="viewbox">
<Canvas x:Name="canvas">
<Rectangle x:Name="rect" Canvas.Top="10" Canvas.Left="10" Stroke="Red" StrokeThickness="1"/>
<Button Canvas.Top="20" Canvas.Left="20">Test Button</Button>
<Ellipse Canvas.Top="100" Canvas.Left="100" Width="100" Height="100" Stroke="Red" StrokeThickness="10"/>
<TextBlock Canvas.Top="100" Canvas.Left="100" FontSize="15">Some Text</TextBlock>
</Canvas>
</Viewbox>
</Window>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
namespace WpfApplication12
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
// HD
const int screenwidth = 1366;
const int screenheight = 768;
// FULL HD
//const int screenwidth = 1920;
//const int screenheight = 1080;
public MainWindow()
{
InitializeComponent();
Top = 0;
Left = 0;
canvas.Width = screenwidth;
canvas.Height = screenheight;
rect.Width = screenwidth - 20;
rect.Height = screenheight - 20;
}
private void Window_Loaded(object sender, RoutedEventArgs e)
{
bool bScaleBackToPixels = true;
if (bScaleBackToPixels)
{
PresentationSource presentationsource = PresentationSource.FromVisual(this);
Matrix m = presentationsource.CompositionTarget.TransformToDevice;
double DpiWidthFactor = m.M11;
double DpiHeightFactor = m.M22;
viewbox.Width = screenwidth / DpiWidthFactor;
viewbox.Height = screenheight / DpiHeightFactor;
}
else
{
viewbox.Width = screenwidth;
viewbox.Height = screenheight;
}
}
}
}
<Window x:Class="WpfApplication12.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
WindowStyle="None"
AllowsTransparency="True" Background="White"
SizeToContent="WidthAndHeight"
Title="MainWindow" Loaded="Window_Loaded">
<Canvas x:Name="canvas">
<Rectangle x:Name="rect" Canvas.Top="10" Canvas.Left="10" Stroke="Red" StrokeThickness="1"/>
<Button Canvas.Top="20" Canvas.Left="20">Test Button</Button>
<Ellipse Canvas.Top="100" Canvas.Left="100" Width="100" Height="100" Stroke="Red" StrokeThickness="10"/>
<TextBlock Canvas.Top="100" Canvas.Left="100" FontSize="15">Some Text</TextBlock>
</Canvas>
</Window>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
namespace WpfApplication12
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
// HD
const int screenwidth = 1366;
const int screenheight = 768;
// FULL HD
//const int screenwidth = 1920;
//const int screenheight = 1080;
public MainWindow()
{
InitializeComponent();
Top = 0;
Left = 0;
canvas.Width = screenwidth;
canvas.Height = screenheight;
rect.Width = screenwidth - 20;
rect.Height = screenheight - 20;
}
private void Window_Loaded(object sender, RoutedEventArgs e)
{
bool bScaleBackToPixels = true;
if (bScaleBackToPixels)
{
PresentationSource presentationsource = PresentationSource.FromVisual(this);
Matrix m = presentationsource.CompositionTarget.TransformToDevice;
double DpiWidthFactor = m.M11;
double DpiHeightFactor = m.M22;
double scalex = 1 / DpiWidthFactor;
double scaley = 1 / DpiHeightFactor;
canvas.LayoutTransform = new ScaleTransform(scalex, scaley);
}
}
}
}
在96 DPI设置(较小 - 100%),屏幕看上去是这样的:
在120 DPI设置(中等 - 125%)(即96 X 1.25 = 120DPI)屏幕使用上面(即它的外观与第一屏幕)我ScaleBackToPixels技术时看起来像这样。
在120 DPI设置(中 - 125%)(即96 X 1.25 = 120DPI)的屏幕看起来是这样的,当你根本就不做任何调整(注意圆是如何较大,并且按钮的字体和大小)。
所有3张并排比较:
这里是一个让屏幕分辨率1920x1080(FullHD的)可见在我的笔记本电脑的屏幕分辨率1366×768的转变:
XAML
<ContentControl Canvas.Left="1630" Canvas.Top="400" Content="{Binding Time}" />
<ContentControl Canvas.Left="1630" Canvas.Top="590" Content="{Binding NextPrayTime}" />
<ContentControl Canvas.Left="1650" Canvas.Top="700" Content="{Binding Today}" />
<ContentControl Canvas.Right="520" Canvas.Top="120" Content="{Binding Content}" />
<ContentControl Canvas.Left="0" Canvas.Top="965" Content="{Binding PrayTimes}">
</ContentControl>
</Canvas>
</Viewbox>
C#
static public class HD
{
static public float Width { get { return 1366.0f; } }
static public float Height { get { return 768.0f; } }
}
static public class FHD
{
static public float Width { get { return 1920.0f; } }
static public float Height { get { return 1080.0f; } }
}
static public class HDRatios
{
static public double Width
{
get
{
#if (DEBUG)
return double.Parse((HD.Width / FHD.Width).ToString("0.0"));
#else
return 1;
#endif
}
}
static public double Height
{
get
{
#if (DEBUG)
return double.Parse((HD.Height / FHD.Height).ToString("0.0"));
#else
return 1;
#endif
}
}
该代码表明,在开发环境(调试标志)的转换将被应用,并在发行版的改造不会因为应用Canvas.Left
和Canvas.Top
根据全高清的分辨率。
我希望,这一经验将有助于其他人遇到一个WPF内显示控件Canvas
的绝对指标。