implementing-interactive-viewer

用途

该技能用于在 .NET MAUI 应用中实现交互式内容查看器。它基于 Syncfusion 的 SfInteractiveViewer 控件，为图像、文档、图纸等视觉内容提供直观的查看与导航能力，包括缩放、平移、旋转和重置。

主要能力

缩放：通过 IsZoomEnabled 启用或禁用缩放，使用 ZoomFactor 以编程方式设置缩放级别，并通过 MinimumZoomFactor 与 MaximumZoomFactor 配置缩放上下限。
平移：支持对大型或复杂视觉内容进行平移浏览。
旋转：调用 Rotate() 方法可将内容顺时针旋转 90 度，支持循环旋转，并可与 UI 按钮集成。
重置：调用 Reset() 方法可将内容恢复到原始缩放与平移状态。
事件：提供 ZoomFactorChanged 事件（缩放级别变化时触发）和 ScrollChanged 事件（平移位置变化时触发），可用于实时交互跟踪与自定义处理。

使用方式

基本初始化示例：

using Syncfusion.Maui.InteractiveViewer;

var viewer = new SfInteractiveViewer
{
    IsZoomEnabled = true,
    ZoomFactor = 1.0,
    MinimumZoomFactor = 0.5,
    MaximumZoomFactor = 10.0,
    Content = new Image { Source = "image.png", Aspect = Aspect.AspectFit }
};

viewer.Rotate(); // 顺时针旋转 90 度
viewer.Reset();  // 恢复原始状态

XAML 中嵌入内容并配合按钮的示例：

<Grid RowDefinitions="0.9*, 0.1*">
    <interactiveViewer:SfInteractiveViewer x:Name="viewer">
        <Image Source="image.png" Aspect="AspectFit" />
    </interactiveViewer:SfInteractiveViewer>

    <StackLayout Grid.Row="1" Orientation="Horizontal" Spacing="10">
        <Button Text="Rotate" Clicked="OnRotate" />
        <Button Text="Reset" Clicked="OnReset" />
    </StackLayout>
</Grid>

private void OnRotate(object sender, EventArgs e) => viewer.Rotate();
private void OnReset(object sender, EventArgs e) => viewer.Reset();

带缩放限制的配置示例：

<interactiveViewer:SfInteractiveViewer
    IsZoomEnabled="True"
    MinimumZoomFactor="0.5"
    MaximumZoomFactor="10.0"
    ZoomFactor="1.0">
    <Image Source="document.png" Aspect="AspectFit" />
</interactiveViewer:SfInteractiveViewer>

事件驱动缩放跟踪示例：

<interactiveViewer:SfInteractiveViewer
    ZoomFactorChanged="OnZoomChanged"
    ScrollChanged="OnScroll">
    <Image Source="image.png" Aspect="AspectFit" />
</interactiveViewer:SfInteractiveViewer>

private void OnZoomChanged(object sender, ZoomFactorChangedEventArgs e)
{
    Debug.WriteLine($"Zoom: {e.OldZoomFactor} → {e.NewZoomFactor}");
}

技能还提供分主题的参考文档，包括：入门（环境配置、NuGet 安装、处理器注册、命名空间导入、基本初始化、XAML 嵌入内容）、缩放与平移、旋转、重置功能、事件与交互。

关键属性

IsZoomEnabled（bool）：启用或禁用缩放功能，默认 true。
ZoomFactor（double）：当前缩放级别，可编程控制。
MinimumZoomFactor（double）：允许的最小缩放级别。
MaximumZoomFactor（double）：允许的最大缩放级别。
Content（View）：要显示的视觉内容。

关键方法

Rotate()：将内容顺时针旋转 90 度。
Reset()：将内容恢复到原始缩放与平移位置。

关键事件

ZoomFactorChanged：缩放级别变化时触发。
ScrollChanged：平移位置变化时触发。

适用场景

医学影像查看器：缩放和平移详细的诊断图像。
建筑蓝图查看器：浏览大型技术图纸。
电商产品查看器：交互式探索产品图片。
文档扫描仪：查看和浏览扫描文档。
GIS/地图查看器：缩放地理数据与影像。

限制

资料未提供关于收费、价格、平台兼容性、性能限制或具体版本要求的信息，暂未提供。