65.9K
CodeProject 正在变化。 阅读更多。
Home

C# 可滚动 Picturebox 自定义控件

starIconstarIconstarIconstarIcon
emptyStarIcon
starIcon

4.44/5 (8投票s)

2008年6月9日

CPOL

4分钟阅读

viewsIcon

114773

downloadIcon

5101

本文讨论了用于向项目添加可滚动 Picturebox 控件的自定义控件的构建。

引言

本文讨论了用于向项目添加可滚动 Picturebox 控件的自定义控件的构建。 有多种方法可以滚动图像; 例如,可以使用 GDI+ 完成,但此演示中采用的方法基于我认为最简单的方法; 即只需滚动包含在设置为自动大小的面板控件中的完整大小的图像。 通过将控件构建为自定义控件,您可以在任何可能需要提供此类功能的应用程序中重复使用。

image001.jpg
图 1:加载到测试应用程序中的自定义控件

由于控件基于面板控件,因此您将获得面板控件中包含的所有属性,这将使这个简单的控件立即变得更有用(例如,您将能够将控件停靠到窗体中)。

入门

为了开始,请解压缩包含的项目,并在 Visual Studio 2008 环境中打开该解决方案。 解决方案中包含两个项目。“TestControl”是第一个项目,它是一个 Windows 窗体应用程序,用于测试自定义控件。 第二个项目 (XPicbox) 是一个类库,包含一个名为 XtendPicBox.cs 的自定义控件。 在解决方案资源管理器中,您应该注意以下各项

image002.png
图 2:解决方案资源管理器

自定义控件 (XtendPicBox.cs)

扩展的图片框自定义控件包含在可滚动容器中显示图像所需的一切。 该控件本身是面板控件的扩展。 在扩展控件中,配置了一个图片框控件并将其添加到面板的控件集合中。 初始化控件时,图片框设置为控件的左上角,并且其大小模式设置为正常。 控件中的属性既用于限制使用者对面板控件的自动滚动属性的访问(必须将其设置为 true 才能滚动图像),又允许使用者在设计时和运行时设置内部图片框中显示的图像文件。

自定义控件类以以下库导入开始

using System.ComponentModel;
using System.Drawing;
using System.Windows.Forms;

导入之后,定义了命名空间和类。 添加了一个构造函数以及一系列本地成员变量。 本地成员变量包括内部 Picturebox 控件的声明、Picturebox 图像的路径以及用于将自动滚动设置为 true 的布尔值(对于扩展面板控件)。 构造函数用于配置 Picturebox 并将 Picturebox 控件添加到扩展面板控件。

namespace XPicbox
{

    /// <summary>
    /// Extend the panel control to provide a
    /// scrollable picturebox control
    /// </summary>
    public partial class XtendPicBox : Panel
    {

#region Local Member Variables

        PictureBox innerPicture = new PictureBox();
        private string mPictureFile = string.Empty;
        private bool mAutoScroll = true;

#endregion


#region Constructor


        /// <summary>
        /// Constructor - set up the inner
        /// picture box so that is plants itself
        /// in the top left corner of the panel 
        /// and so that its size mode is always
        /// set to normal.  At normal, the picture
        /// will appear at full size.
        /// </summary>

        public XtendPicBox()
        {
            InitializeComponent();

            // add the inner picture
            innerPicture.Top = 0;
            innerPicture.Left = 0;
            innerPicture.SizeMode = PictureBoxSizeMode.Normal;
            
            Controls.Add(innerPicture);
        }

#endregion

接下来是自定义控件的属性。 第一个属性用于设置要在内部 Picturebox 控件中显示的图像文件。 设置属性以描述该属性在 IDE 中使用时的用途; 这些属性还指定将使用文件名编辑器设置该属性; 如果控件使用者选择在设计时设置图像文件,这将支持在 IDE 中打开文件浏览器窗口。 如果此处未指定编辑器,则控件使用者将不得不键入图像文件的路径。

第二个属性仅覆盖了扩展面板控件的自动滚动属性。 通过覆盖该属性并将 Browsable 属性设置为 false,将拒绝控件使用者在设计时使用属性编辑器设置该属性。 由于我们始终希望将面板的自动滚动属性设置为 true,因此我们阻止对该属性的访问并在自定义控件的代码中设置该值。

#region Properties


        /// <summary>
        /// Allow control consumer to set the image
        /// used in the internal picture box through
        /// this public and browsable property -
        /// set the editor to the file name editor
        /// to make the control easier to use at
        /// design time (to provide an interface for
        /// browsing to and selecting the image file
        /// </summary>
        [Category("Image File")]
        [Browsable(true)]
        [Description("Set path to image file.")]
        [Editor(typeof(System.Windows.Forms.Design.FileNameEditor),
          typeof(System.Drawing.Design.UITypeEditor))]
        public string PictureFile
        {
            get
            {
                return mPictureFile;
            }
            set
            {
                mPictureFile = value;

                if (!string.IsNullOrEmpty(mPictureFile))
                {
                    // set the image to the image file
                    innerPicture.Image = Image.FromFile(mPictureFile);

                    // resize the image to match the image file
                    innerPicture.Size = innerPicture.Image.Size;
                }
            }
        }

        /// <summary>

        /// Override the autoscroll property
        /// and use the browsable attribute
        /// to hide it from control consumer -
        /// The property will always be set
        /// to true so that the picturebox will
        /// always scroll
        /// </summary>
        [Browsable(false)]
        public override bool AutoScroll
        {
            get
            {
                return mAutoScroll;
            }
            set
            {
                mAutoScroll = value;
            }
        }

#endregion

这就是构建自定义控件的全部内容。 编译后,您可以在任何需要此类功能的项目中使用该控件。

测试窗体 (Form1.vb)

查看测试项目,您将找到一个包含定义了 File->Open 和 File->Exit 功能的菜单的单个窗体,并且您将找到自定义控件的单个实例。 自定义控件已完全停靠在窗体中。 这里没有太多需要担心的代码; 文件打开方法确实演示了在运行时设置控件图像文件的能力,因此您可能想看看它。 测试窗体的整个代码如下

using System;
using System.ComponentModel;
using System.Drawing;
using System.Windows.Forms;

namespace TestControl
{

    /// <summary>

    /// Demo application for scrollable
    /// picturebox control
    /// </summary>
    public partial class Form1 : Form
    {

        /// <summary>
        /// Default constructor
        /// </summary>
        public Form1()
        {
            InitializeComponent();
        }


        /// <summary>
        /// Open a new image file into the scrollable
        /// picture box control
        /// </summary>

        /// <param name="sender"></param>
        /// <param name="e"></param>
        private void openToolStripMenuItem_Click(object sender, EventArgs e)
        {
            OpenFileDialog openFileDialog1 = new OpenFileDialog();

            openFileDialog1.Title = "Open Image File";
            openFileDialog1.Filter = "Bitmap Files|*.bmp" +
                "|Enhanced Windows MetaFile|*.emf" +
                "|Exchangeable Image File|*.exif" +
                "|Gif Files|*.gif|Icons|*.ico|JPEG Files|*.jpg" +
                "|PNG Files|*.png|TIFF Files|*.tif|Windows MetaFile|*.wmf";

            openFileDialog1.FilterIndex = 6;
            openFileDialog1.FileName = "";
            openFileDialog1.ShowDialog();

            if (openFileDialog1.FileName == "")
                return;

            // set the extended picturebox control's
            // image to the open file dialog's filename
            this.xtendPicBox1.PictureFile = openFileDialog1.FileName;
        }


        /// <summary>

        /// Close the demo application
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        private void exitToolStripMenuItem_Click(object sender, EventArgs e)
        {
            this.Dispose();
        }
    }
}

摘要

此解决方案提供了一个自定义控件,该控件可用于在可滚动容器中显示图像文件。 控件中使用的方法并不是什么新鲜事物或新颖事物; 该项目确实提供了一个简单的示例,说明如何构建自定义控件、如何扩展现有控件以及如何将设计时支持添加到自定义控件。 构建此自定义控件的相同方法可以应用于构建其他自定义控件。

© . All rights reserved.