Bootstrap Blazor Viewer 图片浏览器组件更新

示例:

使用方法:

1.nuget包

BootstrapBlazor.Viewer

2._Imports.razor 文件或者页面添加添加组件库引用

@using BootstrapBlazor.Components

3.razor页面

Demo

<Viewerjs />

多图片

<Viewerjs Images='new List<string>() { "photo-2.jpg","photo-1.jpg","photo-3.jpg"}' />

单图片

<Viewerjs Src="@_srcPhoto" Width="600px" Height="300px" />

单图片+简化工具条

<Viewerjs Src="@_srcPhoto" Width="600px" Height="300px" toolbarlite="true" />

多图片+简化工具条

<Viewerjs Images='new List<string>() { "photo-2.jpg","photo-1.jpg","photo-3.jpg"}' toolbarlite="true" />

单图片流

<Viewer SrcStream="imagesStreamList[1]" />

多图片流

<Viewer ImagesStream="imagesStreamList" />

本地单图片,组件流读取

<Viewer Src='@(@"F:\images\objects.jpg")' LocalFileToStream />

4.参数说明

v7.0.2

支持流转图片(ImageFromStream), 用于本地项目例如 MAUI Blazor,Blazor hybrid,因为chorome不支持file:///xx 方式显示本地图片
添加 ImagesStream : 图片流列表
SrcStream : 单图片流
LocalFileToStream : 使用流读取本地图片