# ImagePreview 图片预览控件

`ImagePreview` 是可嵌入窗体的图片预览控件，适合在固定区域内展示图片集合，并支持上一张/下一张、适配方式和自定义按钮。

如果需要弹出全屏/浮层预览，请看 [Preview 图片预览](preview.html)。

## 最小示例

```aardio
import win.ui;
import dotNet.AntdUI;
import System.Drawing;

var winform = win.form(text="AntdUI ImagePreview";right=620;bottom=420)
winform.add(host={cls="custom";left=20;top=20;right=600;bottom=380;z=1})

var preview = AntdUI.ImagePreview(winform.host);
preview.Fit = AntdUI.TFit.Contain;
preview.ShowDefaultBtn = true;

var item = AntdUI.ImagePreviewItem();
item.ID = "demo";
item.Img = System.Drawing.Bitmap(200,120);
preview.Image.Add(item);

winform.show();
win.loopMessage();
```

## ImagePreview 常用属性

| 属性 | 说明 |
| --- | --- |
| `Image` | 图片项集合，添加 `AntdUI.ImagePreviewItem` |
| `SelectIndex` | 当前图片序号，0 基索引 |
| `PageSize` | 图片数量 |
| `Fit` | 图片布局，`AntdUI.TFit` |
| `ShowBtn` | 是否显示按钮区域 |
| `ShowDefaultBtn` | 是否显示默认按钮 |
| `CustomButton` | 自定义按钮集合，添加 `ImagePreviewButton` |
| `BtnSize` / `BtnIconSize` / `BtnLRSize` | 按钮大小 |
| `ContainerPadding` | 容器边距 |
| `BtnPadding` | 按钮边距 |

常用事件：

```aardio
preview.SelectIndexChanged = function(sender,e){
    // 图片序号改变
}

preview.ButtonClick = function(sender,e){
    // 自定义按钮点击
}
```

## ImagePreviewItem

```aardio
var item = AntdUI.ImagePreviewItem();
item.SetID("img1").SetImage(System.Drawing.Bitmap(200,120)).SetTag("业务数据");
preview.Image.Add(item);
```

常用属性/方法：

- `ID` / `SetID(id)`
- `Img` / `SetImage(image)`
- `Call`：按需取图回调
- `CallProg`：带进度的按需取图回调
- `Tag` / `SetTag(value)`

## ImagePreviewButton

```aardio
var btn = AntdUI.ImagePreviewButton("download","<svg></svg>");
btn.SetTag("下载当前图片");
preview.CustomButton.Add(btn);
```

常用属性/方法：`Name`、`IconSvg`、`Tag`、`SetName`、`SetIcon`、`SetTag`。

## 常见坑

- `ImagePreview` 是控件，需要 custom 宿主；`Preview` 是静态弹层。
- `SelectIndex` 使用 0 基索引。
- `ImagePreviewItem.SetImage(...)` 需要 `System.Drawing.Image`，例如 `System.Drawing.Bitmap(path)` 或 `System.Drawing.Bitmap(width,height)`。
- 自定义按钮图标需要实际 SVG 字符串，示例中的 `<svg></svg>` 只是占位。