精通
英语
和
开源
，
擅长
开发
与
培训
，
胸怀四海
第一信赖
精通
英语
和
开源
，
擅长
开发
与
培训
，
胸怀四海
第一信赖
锐英源精品开源心得，转载请注明：“锐英源www.wisestudy.cn，孙老师作品，电话13803810136。”需要全文内容也请联系孙老师。
I recently was involved in a project for the TabletPC where we had keep in mind that the user of the application would be using a pen to navigate the forms instead of the mouse. In addition, our application was going to be on the tablet in the hands of users with little to no Microsoft Windows exposure. We needed a controlled, idiot-proof, environment that was also friendly with a pen.
We decided to create our own 'skin' for the application, similar to many media and MP3 players available. Therefore, we needed buttons that could handle the four states of user interaction:
我最近参与了TabletPC的一个项目，我们关注到，应用程序的用户将使用笔来导航表单而不是鼠标。此外，我们的应用程序将在用户手里的平板电脑上，几乎没有微软Windows现成的东西用。我们需要一个受控件、防止白痴的环境，用钢笔也很友好。
我们决定为应用程序创建自己的“皮肤”，类似于许多媒体和MP3播放器。因此，我们需要能够处理用户交互的四种状态的按钮：
The controls are implemented as derived classes from one another and one base class, which extend the .NET Framework's System.Windows.Forms.Button class. All controls are compatible with the windows forms designer in Visual Studio.控件实现为彼此的派生类和一个基类，它们扩展了.NET Framework的 System.Windows.Forms.Button类。所有控件都与Visual Studio中的窗体窗体设计器兼容。
Naturally, for a graphical button to work you must provide the graphics for it to use. There is a property for the graphic to be used for each of the states indicated above, as a System.Drawing.Image object. All the GraphicControls classes require at least the NormalImage to be assigned, or else an exception will be thrown. If one of the states does not have an image assigned, the controls default to displaying the normal state image. I chose not to implement these classes using image indexing, because it was easier for our Adobe PhotoShop graphics developer to manage the numerous images using seperate images. These can be easily assigned using the forms designer or directly in the code.当然，要使图形按钮起作用，您必须提供要使用的图形。作为System.Drawing.Image对象，存在用于上述每个状态的图形的属性。所有GraphicControls 类至少NormalImage需要分配，否则将抛出异常。如果其中一个状态没有指定图像，则控件默认显示正常状态图像。我选择不使用图像索引来实现这些类，因为我们的Adobe PhotoShop图形开发人员使用单独的图像管理大量图像更容易。这些可以使用表单设计器轻松分配，也可以直接在代码中分配。
Each control allows for the button to respond to mouse events from the entire control surface, or an optional ClickRegion can be assigned using in your code to restrict the area of the control surface. When a mouse event occurs, the mouse position is checked against the figure created by the click region (in button window coordinates) to make sure it falls within the region before it is processed. This allows for buttons which are not the standard rectangle shape to respond as the user would expect, with no ghost actions outside of the obvious button graphic. There are several methods available to define the click region, but we found that the version accepting a Point[] array was best because we could use the image map (intended for a web control) point coordinates generated by Adobe PhotoShop.每个控件都允许按钮响应整个控件界面的鼠标事件，或者代码中可以使用可选项ClickRegion的来响应控件界面的限制区域。发生鼠标事件时，将根据单击区域（在按钮窗口坐标中）创建的图形检查鼠标位置，以确保它在处理之前落入区域内。这允许不是标准矩形形状的按钮以用户期望的方式响应，在明显的按钮图形之外没有鬼动作。有几种方法可用于定义点击区域，但我们发现接受Point[]数组的版本是最好的，因为我们可以使用Adobe PhotoShop生成的图像映射（用于Web控件）点坐标。
Our design provided for multiple visual cues (buttons) to trigger an eaction or indicate a state change among those listed above. To allow these buttons to manage this relationship, all of them process and inherit the ability to echo a change in its own state to other interested buttons and to process the events triggered by other buttons it has interest in. This is done through the standard .NET event-handler model. Static methods are provided to manage the buttons interested in one another, EnableEchoButtonPair and DisableEchoButtonPair. This allows a change in state due to a mouse over event for one button to also mimic in those buttons subscribed to the GraphicButtonStateEcho event. This makes the multiple visual cues react consistently regardless of which button is being manipulated by the end user. Note that the disable state is managed by the standard control property Enabled, and is also processed as an echo only through a different event.我们的设计提供了多个视觉提示（按钮）来触发动作或指示上面列出的状态变化。为了允许这些按钮管理这种关系，所有这些按钮都处理并继承了将其自身状态的变化回显给其他感兴趣的按钮并处理由其感兴趣的其他按钮触发的事件的能力。这是通过标准完成的。 NET事件处理程序模型。提供静态方法来管理彼此感兴趣的按钮，EnableEchoButtonPair以及DisableEchoButtonPair。这允许由于一个按钮的鼠标悬停事件而导致的状态改变也模仿订阅该按钮的那些按钮 GraphicButtonStateEcho事件。这使得多个视觉提示始终如一地反应，而不管最终用户操纵哪个按钮。请注意，禁用状态由标准控件属性管理Enabled，并且仅通过不同的事件处理为回显。
This is the abstract base class defining the fundamental methods and properties needed to manage a graphic-based button in this context. I defined this class in the event I needed to derive other graphic-based buttons which could not or should not inherit from the other controls, but I haven't found a need to yet.这是抽象基类，用于定义在此上下文中管理基于图形的按钮所需的基本方法和属性。我在需要派生其他基于图形的按钮的事件中定义了这个类，这个按钮不能或不应该从其他控件继承，但我还没有找到需要。
This is the graphic-based button which effectively mimics a standard Windows button. All that is needed is the relevant images assigned and it works the same. The property ButtonState is available at run-time to query the current state of the button.这是基于图形的按钮，可有效模仿标准Windows按钮。所需要的只是分配的相关图像，它的工作原理相同。该属性ButtonState在运行时可用于查询按钮的当前状态。
This control is derived from the GraphicButton and alters the behavior so the button toggles itself on or off, like a light switch or toolbar setting. The toggle button requires one addition image, the PressedImage, which is used to indicate the On or Active state. It also has an additional property Active, to indicate whether or not the toggle button is Active or Inactive. It disables the Click event, since it really doesn't make sense for this button and adds another event called Toggled, which can be handled to be notified when the event toggles between the active and inactive states.此控件来自GraphicButton并改变行为，因此按钮可以打开或关闭，例如灯光开关或工具栏设置。切换按钮需要一个附加图像，PressedImage用于指示“开”或“ 活动”状态。它还有一个附加属性Active，用于指示切换按钮是处于活动状态还是处于非活动状态。它会禁用该Click事件，因为它对此按钮确实没有意义，并添加了另一个被调用的事件Toggled，可以处理该事件，以便在事件在活动和非活动状态之间切换时得到通知。
I have been arguing with myself on the name for this control, and finally gave up and settled on this one. This control mimics a selector panel, where only one button on the panel can be active at the same point in time. This control is derived from the GraphicToggleButton, with an added twist that it automatically becomes inactive when one of the other buttons in the panel becomes active, it automatically changes itself to inactive. This control also only triggers the Toggled event when it becomes active, so handlers do not get unnecessarily notified of the toggle buttons becoming inactive when only the new state of the selector panel is required. I used it to manage a task progression/selection bar in our application. I chose not to implement a logical or control container, so placement of the buttons can be anywhere within the application.我一直在和自己争论这个控件的名字，最后放弃并决定这个。此控件模拟选择器面板，其中面板上只有一个按钮可以在同一时间点处于活动状态。此控件源自以下内容：GraphicToggleButton当面板中的其他按钮之一变为活动状态时，它会自动变为非活动状态，并自动将其自身更改为非活动状态。当变为活动状态时此控件也只会触发Toggled事件，当仅需要选择器面板的新状态时，处理程序不会不必要地通知切换按钮变为非活动状态。我用它来管理我们应用程序中的任务进度/选择栏。我选择不实现逻辑或控件容器，因此按钮的位置可以在应用程序中的任何位置。
Looking at the snapshot of the demo application included you can see that the various feature available from these controls are shown. Below I have cut out a minimal piece of code to show what needs to be added to get the additional functionality above the standard Windows button. I also include the code generated by the forms designer for the control.查看演示应用程序的快照，您可以看到显示这些控件提供的各种功能。下面我已经摘抄了一小段代码，以显示需要添加什么才能获得标准Windows按钮之上的附加功能。我还包括表单设计器为控件生成的代码。
using System;
using System.Drawing;
using System.Collections;
using System.ComponentModel;
using System.Windows.Forms;
using System.Data;
namespace GraphicControlDemo
{
public class GraphicButtonsWithEcho : System.Windows.Forms.Form
{
.
.
.
private GraphicControls.GraphicToggleButton graphicToggleButton1;
private GraphicControls.GraphicToggleButton graphicToggleButton2;
private GraphicControls.GraphicMultiButtonPanelButton
graphicMultiButtonPanelButton1;
private GraphicControls.GraphicMultiButtonPanelButton
graphicMultiButtonPanelButton2;
.
.
.
public GraphicButtonsWithEcho()
{
//
// Required for Windows Form Designer support
//
InitializeComponent();
graphicMultiButtonPanelButton1.SetClickRegion(
new Point[] { new Point( 1, 2 ), new Point( 49, 1 ),
new Point( 77, 17 ), new Point( 89, 51 ),
new Point( 1, 52 ) } );
graphicMultiButtonPanelButton2.SetClickRegion( new Point[]
{ new Point( 1, 52 ), new Point( 12, 19 ),
new Point( 38, 4 ), new Point( 89, 1 ),
new Point( 88, 52 ) } );
graphicMultiButtonPanelButton1.AddPanelButton(
graphicMultiButtonPanelButton2 );
graphicMultiButtonPanelButton2.AddPanelButton(
graphicMultiButtonPanelButton1 );
//initialize one button unless the initial state should be
// undetermined
graphicMultiButtonPanelButton1.Active = true;
// alternate assignment method
// GraphicControls.GraphicMultiButtonPanelButton[] HandSelectors =
new GraphicControls.GraphicMultiButtonPanelButton[ 2 ];
// HandSelectors[0] = graphicMultiButtonPanelButton1;
// HandSelectors[1] = graphicMultiButtonPanelButton2;
// graphicMultiButtonPanelButton1.AddPanelButtons( HandSelectors );
// graphicMultiButtonPanelButton2.AddPanelButtons( HandSelectors );
}
.
.
.
#region Windows Form Designer generated code
/// <summary>
/// Required method for Designer support - do not modify
/// the contents of this method with the code editor.
/// </summary>
private void InitializeComponent()
{
.
.
.
this.graphicToggleButton1 =
new GraphicControls.GraphicToggleButton();
this.graphicToggleButton2 =
new GraphicControls.GraphicToggleButton();
this.graphicMultiButtonPanelButton1 =
new GraphicControls.GraphicMultiButtonPanelButton();
this.graphicMultiButtonPanelButton2 =
new GraphicControls.GraphicMultiButtonPanelButton();
.
.
.
//
// graphicToggleButton1
//
this.graphicToggleButton1.DisabledImage =
((System.Drawing.Bitmap)(resources.GetObject(
"graphicToggleButton1.DisabledImage")));
this.graphicToggleButton1.Location =
new System.Drawing.Point(320, 80);
this.graphicToggleButton1.Name = "graphicToggleButton1";
this.graphicToggleButton1.NormalImage =
((System.Drawing.Bitmap)(resources.GetObject(
"graphicToggleButton1.NormalImage")));
this.graphicToggleButton1.OverImage =
((System.Drawing.Bitmap)(resources.GetObject(
"graphicToggleButton1.OverImage")));
this.graphicToggleButton1.PressedImage =
((System.Drawing.Bitmap)(resources.GetObject(
"graphicToggleButton1.PressedImage")));
this.graphicToggleButton1.Size = new System.Drawing.Size(112, 23);
this.graphicToggleButton1.TabIndex = 10;
this.graphicToggleButton1.Toggled +=
new System.EventHandler(this.graphicToggleButton1_Toggled);
//
// graphicToggleButton2
//
this.graphicToggleButton2.DisabledImage =
((System.Drawing.Bitmap)(resources.GetObject(
"graphicToggleButton2.DisabledImage")));
this.graphicToggleButton2.Location =
new System.Drawing.Point(320, 48);
this.graphicToggleButton2.Name = "graphicToggleButton2";
this.graphicToggleButton2.NormalImage =
((System.Drawing.Bitmap)(resources.GetObject(
"graphicToggleButton2.NormalImage")));
this.graphicToggleButton2.OverImage =
((System.Drawing.Bitmap)(resources.GetObject(
"graphicToggleButton2.OverImage")));
this.graphicToggleButton2.PressedImage =
((System.Drawing.Bitmap)(resources.GetObject(
"graphicToggleButton2.PressedImage")));
this.graphicToggleButton2.Size = new System.Drawing.Size(112, 23);
this.graphicToggleButton2.TabIndex = 9;
this.graphicToggleButton2.Toggled +=
new System.EventHandler(this.graphicToggleButton2_Toggled);
//
// graphicMultiButtonPanelButton1
//
this.graphicMultiButtonPanelButton1.DisabledImage =
((System.Drawing.Bitmap)(resources.GetObject(
"graphicMultiButtonPanelButton1.DisabledImage")));
this.graphicMultiButtonPanelButton1.Location =
new System.Drawing.Point(0, 88);
this.graphicMultiButtonPanelButton1.Name =
"graphicMultiButtonPanelButton1";
this.graphicMultiButtonPanelButton1.NormalImage =
((System.Drawing.Bitmap)(resources.GetObject(
"graphicMultiButtonPanelButton1.NormalImage")));
this.graphicMultiButtonPanelButton1.OverImage =
((System.Drawing.Bitmap)(resources.GetObject(
"graphicMultiButtonPanelButton1.OverImage")));
this.graphicMultiButtonPanelButton1.PressedImage =
((System.Drawing.Bitmap)(resources.GetObject(
"graphicMultiButtonPanelButton1.PressedImage")));
this.graphicMultiButtonPanelButton1.Size =
new System.Drawing.Size(92, 55);
this.graphicMultiButtonPanelButton1.TabIndex = 1;
//
// graphicMultiButtonPanelButton2
//
this.graphicMultiButtonPanelButton2.DisabledImage =
((System.Drawing.Bitmap)(resources.GetObject(
"graphicMultiButtonPanelButton2.DisabledImage")));
this.graphicMultiButtonPanelButton2.Location =
new System.Drawing.Point(352, 88);
this.graphicMultiButtonPanelButton2.Name =
"graphicMultiButtonPanelButton2";
this.graphicMultiButtonPanelButton2.NormalImage =
((System.Drawing.Bitmap)(resources.GetObject(
"graphicMultiButtonPanelButton2.NormalImage")));
this.graphicMultiButtonPanelButton2.OverImage =
((System.Drawing.Bitmap)(resources.GetObject(
"graphicMultiButtonPanelButton2.OverImage")));
this.graphicMultiButtonPanelButton2.PressedImage =
((System.Drawing.Bitmap)(resources.GetObject(
"graphicMultiButtonPanelButton2.PressedImage")));
this.graphicMultiButtonPanelButton2.Size =
new System.Drawing.Size(92, 55);
this.graphicMultiButtonPanelButton2.TabIndex = 2;
//
// GraphicButtonsWithEcho
//
this.AutoScaleBaseSize = new System.Drawing.Size(5, 13);
this.ClientSize = new System.Drawing.Size(480, 374);
this.Controls.AddRange(new System.Windows.Forms.Control[] {
this.panel1,
this.button4,
this.button5,
this.label3,
this.button6,
this.graphicToggleButton1,
this.graphicToggleButton2,
this.button3,
this.button2,
this.label2,
this.label1,
this.graphicButton3,
this.button1,
this.graphicButton2,
this.graphicButton1});
this.Name = "GraphicButtonsWithEcho";
this.Text = "Graphic Buttons with Echo";
this.panel1.ResumeLayout(false);
this.ResumeLayout(false);
}
#endregion
.
.
.
private void button1_Click(object sender, System.EventArgs e)
{
// enable the echo of the button state
GraphicControls.GraphicButton.EnableEchoButtonPair(g
raphicButton1,graphicButton2);
button1.Enabled = false;
button2.Enabled = true;
button3.Enabled = true;
}
.
.
.
private void graphicToggleButton2_Toggled(object sender,
System.EventArgs e)
{
MessageBox.Show( this,
"GraphicToggleButton2 Toggled to " +
(graphicToggleButton2.Active ? "Active!" : "Inactive!"));
}
private void graphicToggleButton1_Toggled(object sender,
System.EventArgs e)
{
MessageBox.Show( this,
"GraphicToggleButton1 Toggled to " +
(graphicToggleButton1.Active ? "Active!" : "Inactive!"));
}
}
}
It is easy to use these controls with the forms designer. You just have to add them to the Windows Forms component tab of the Toolbox.
The controls will now be in the list for you to select from. I know they do not have a customized snazzy toolbox icon, but I'm not the graphics guy. Perhaps I will add them at a later time.
使用表单设计器很容易使用这些控件。您只需将它们添加到工具箱的Windows窗体组件选项卡中。
控件现在将在列表中供您选择。我知道他们没有定制的时髦工具箱图标，但我不是美工。也许我会在以后添加它们。