如何在FlowLayoutPanel控件中实现分页效果？

Question

感谢以下代码，我创建了图像并将其作为缩略图添加到 FlowLayoutPanel。

实现非常简单。我读取目录中的可用图像并调用以下子过程。

Private Sub LoadImages(ByVal FlowPanel As FlowLayoutPanel, ByVal fi As FileInfo)
        Pedit = New DevExpress.XtraEditors.PictureEdit
        Pedit.Width = txtIconsWidth.EditValue
        Pedit.Height = Pedit.Width / (4 / 3)
        Dim fs As System.IO.FileStream
        fs = New System.IO.FileStream(fi.FullName, IO.FileMode.Open, IO.FileAccess.Read)
        Pedit.Image = System.Drawing.Image.FromStream(fs)
        fs.Close()
        fs.Dispose()
        Pedit.Properties.SizeMode = DevExpress.XtraEditors.Controls.PictureSizeMode.Zoom

        If FlowPanel Is flowR Then
            AddHandler Pedit.MouseClick, AddressOf Pedit_MouseClick
            AddHandler Pedit.MouseEnter, AddressOf Pedit_MouseEnter
            AddHandler Pedit.MouseLeave, AddressOf Pedit_MouseLeave
        End If

        FlowPanel.Controls.Add(Pedit)
    End Sub

现在，我想延长它。我想创建分页效果。 应用程序应读取所有可用图像，但仅绘制屏幕上可见的图像。

和往常一样，我不知道从哪里开始。我可以用一下你的灯吗？

...C# 版本来了！

private void LoadImages(FlowLayoutPanel FlowPanel, FileInfo fi)
{
    Pedit = new DevExpress.XtraEditors.PictureEdit();
    Pedit.Width = txtIconsWidth.EditValue;
    Pedit.Height = Pedit.Width / (4 / 3);
    System.IO.FileStream fs = null;
    fs = new System.IO.FileStream(fi.FullName, System.IO.FileMode.Open, System.IO.FileAccess.Read);
    Pedit.Image = System.Drawing.Image.FromStream(fs);
    fs.Close();
    fs.Dispose();
    Pedit.Properties.SizeMode = DevExpress.XtraEditors.Controls.PictureSizeMode.Zoom;

    if (object.ReferenceEquals(FlowPanel, flowR)) {
        Pedit.MouseClick += Pedit_MouseClick;
        Pedit.MouseEnter += Pedit_MouseEnter;
        Pedit.MouseLeave += Pedit_MouseLeave;
    }

    FlowPanel.Controls.Add(Pedit);
}

Answer 1

为了加快处理速度，加载图像后，您可以缓存它们，这样您就不必每次需要它们时都从文件流中加载。

虽然我不知道显式代码，但这是一个一般过程：

1）您可以有几个变量，但最重要的是当前页面的整数。

2）接下来，您需要定义每个页面上显示的缩略图数量，可以是常量或另一个整数变量。我们称之为thumbsPerPage

3) 在事件处理程序（OnClick、悬停或您希望的其他操作事件）上，执行以下操作：

4）清除 FlowPanel 中的所有项目，可能类似于 FlowPanel.Controls.Items.Clear()

5）然后在范围内的给定页面添加以下图像： [(currentPage-1) *thumbsPerPage, (currentPage *thumbsPerPage) - 1]

这假设您的图像索引从 0 开始，页面索引从 1 开始

例如，每页 9 张图像： 在第 1 页上您需要图像 [0,8] 在第 2 页上您需要图像 [9,17] 等。

所以在代码中它会类似于

FlowPanel.Items.Clear()
for(int i = (currentPage-1) * thumbsPerPage; i < (currentPage * thumbsPerPage) - 1; i++)
   FlowPanel.Controls.Add(Pedits[i])

最后，将您的代码转换为 C# :)...不是必需的，但当代码不是 VB.NET 时，用户通常更愿意提供帮助