-->

WPF液晶屏全高清(WPF for LCD screen Full HD)

2019-06-28 08:45发布

站内文章 / 移动开发
228 0 0

我正在开发将被显示在全高清液晶屏（42英寸）的WPF应用程序。 此外，我需要适应绝对位置的控制。 在开发环境中我看不到长1920×1080的窗口（这是有针对性的屏幕固定的分辨率）。

什么是完成这个任务的最佳做法是什么？

Answer 1:

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张并排比较：



Answer 2:

这里是一个让屏幕分辨率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的绝对指标。



文章来源: WPF for LCD screen Full HD
标签： wpf canvas viewbox lcd scaletransform
举报

收藏的人(0)

Ta的文章 更多文章
登录 后发表评论
0条评论
还没有人评论过~