wpf CefSharp ChromiumWebBrowser- 允许用户放大/缩小

CefSharp ChromiumWebBrowser- allow user to zoom in/out

提问by Noble-Surfer

I am using the ChromiumWebBrowserprovided by the CefSharplibrary to allow users to view and interact with a website from within my C# application.

我使用的是ChromiumWebBrowser通过所提供的CefSharp库允许用户与网站从我的C＃应用程序中查看和互动。

The website is currently displayed correctly, and the user is able to interact with it fully, as if they were viewing it in a standard web browser.

该网站当前显示正确，并且用户能够与其完全交互，就像他们在标准 Web 浏览器中查看它一样。

I now want to add the functionality to allow users to zoom in/ out when viewing the website from within my application, but I'm unsure how to do this... most of what I've found on the web seems to indicate that I should use the LayoutTransformattribute of the <Grid>tag, and then a <ScaleTransform>tag in my XAML, and I've tried this, but can't seem to get it working...

我现在想添加允许用户在从我的应用程序中查看网站时放大/缩小的功能，但我不确定如何做到这一点......我在网上找到的大部分内容似乎表明我应该使用标签的LayoutTransform属性<Grid>，然后<ScaleTransform>在我的XAML.

My XAMLis as follows:

我XAML的如下：

<Grid x:Name="grdBrowserHost" MinHeight="900" Height="Auto" MinWidth="1200" Width="Auto" Margin="0,0,0,0" DockPanel.Dock="Bottom" Grid.ColumnSpan="1" >
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <Grid.LayoutTransform>
        <ScaleTransform ScaleX="{Binding Path=Value, ElementName=_zoom}" ScaleY="{Binding Path=Value, ElementName=_zoom}" />
    </Grid.LayoutTransform>
    <cefSharp:ChromiumWebBrowser Name="browser" Height="Auto" Width="Auto" Grid.Row="0" Address="www.google.com" Margin="0,35,-0.2,0" />
</Grid>

How would I add the functionality to allow the user to zoom in and out on the content of the cefSharp:ChromiumWebBrowser ...>in this XAML? Ideally, I want them to be able to zoom in/ out by using 'Shift+'/'Shift-'/'Shift and Scroll'.

我将如何添加功能以允许用户放大和缩小cefSharp:ChromiumWebBrowser ...>this 中的内容XAML？理想情况下，我希望它们能够通过使用“Shift+”/“Shift-”/“Shift and Scroll”来放大/缩小。

Anyone have any suggestions, or able to point me to an example of how this is implemented?

任何人都有任何建议，或者能够指出我如何实施的一个例子？

Edit

编辑

So I've managed to implement the functionality to some extent by adding a sliderto the GUI:

因此，我通过slider在 GUI 中添加 a来在一定程度上实现了该功能：

<Slider x:Name="slider" Maximum="100" ValueChanged="zoom" HorizontalAlignment="Left" Margin="1177,260,0,0" VerticalAlignment="Top"/>

and using that to call a function that I've named zoom()- in which I set the browser.ZoomLevelattribute equal to slider.Value:

并使用它来调用我命名的函数zoom()- 在其中我将browser.ZoomLevel属性设置为等于slider.Value：

public void zoom(object sender, RoutedEventArgs e)
{
    browser.ZoomLevel = slider.Value;
}

However, this currently works by clicking the sliderobject on the GUI, and dragging the cursor left/ right, but it seems to 'jump' the zoom from one value to the next as you move the slider, rather than changing it gradually/ making the view zoom in/ out smoothly.

但是，目前这可以通过单击sliderGUI 上的对象并向左/向右拖动光标来实现，但是当您移动滑块时，它似乎将缩放从一个值“跳转”到下一个值，而不是逐渐改变它/使查看放大/缩小平滑。

How would I cause the display to zoom in/out smoothly as the user moves the slider, rather than jumping from 'normal view' to the maximum value (100)?

当用户移动滑块而不是从“正常视图”跳到最大值 (100) 时，我将如何使显示平滑地放大/缩小？

How can I add functionality to zoom in/ out using keyboard shortcuts (such as CTRL+ / CTRL-), rather than using a slider?

如何使用键盘快捷键（例如 CTRL+/CTRL-）而不是使用slider?

回答by Saravanan

How would I cause the display to zoom in/out smoothly as the user moves the slider, rather than jumping from 'normal view' to the maximum value (100)?

当用户移动滑块而不是从“正常视图”跳到最大值 (100) 时，我将如何使显示平滑地放大/缩小？

For this you have to set the zoom level increment

为此，您必须设置缩放级别增量

browser.ZoomLevelIncrement = 0.5;

How can I add functionality to zoom in/ out using keyboard shortcuts (such as CTRL+ / CTRL-), rather than using a slider?

如何使用键盘快捷键（例如 CTRL+/CTRL-）而不是使用滑块添加放大/缩小功能？

Here the below codes used to Zoom In/Out using Ctrl+Mouse-wheel.

以下代码用于使用 Ctrl+鼠标滚轮放大/缩小。

private void OnPreviewKeyUp(object sender, KeyEventArgs e)
{
    if (e.Key == Key.RightCtrl || e.Key == Key.LeftCtrl)
    {
        isControlKeyPressed = false;
    }
}

private void OnKPreviewKeyDown(object sender, KeyEventArgs e)
{
    if (e.Key == Key.RightCtrl || e.Key == Key.LeftCtrl)
    {
        isControlKeyPressed = true;
    }
}

private void OnMouseWheel(object sender, MouseWheelEventArgs e)
{
    if (isControlKeyPressed)
    {
        if (e.Delta > 0 && browser.ZoomLevel <= maxZoomLevel)
        {
            browser.ZoomInCommand.Execute(null);
        }
        else if (e.Delta < 0 && browser.ZoomLevel >= minZoomLevel)
        {
            browser.ZoomOutCommand.Execute(null);
        }
    }
}