Bootstrap Blazor Viewer 圖片瀏覽器元件更新, 支援流轉圖片(ImageFromStream), 用於本地專案例如 MAUI Blazor,Blazor hybrid

範例:

使用方法:

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 : 使用流讀取本地圖片