DevExpress控制元件學習總結 z

weixin_34402090發表於2014-03-17

1、Navigation & Layout

1.1 Bar Manager     

如果想在窗體或使用者控制元件(user control)上新增工具條(bars)或彈出選單(popup menus),我們 需要把一個不可見的控制元件(component)BarManager(Navigation&Layout)拖放到這個窗體或使用者控制元件上。這個控 件維護工具條在窗體上的佈局,處理使用者的行為(processes an end-user's actions),提供一些定製功能等等。這個控制元件維護 工具條、工具條項、工具條專案錄這三者的集合 (It maintains the collections of bars,bar items and bar item categories.)。 所以我們可以使用bar manager的一些方法去新增、刪除、訪問這些工具條元素。

     注意:1)一個窗體上只能放置一個bar manager控制元件。

           2)由於BarManager控制元件與RibbonControl控制元件可能會彼此衝突,所以不推薦在同一個窗體或使用者控制元件上同時使用工具條和Ribbon控制元件。

       當把BarManager新增到一個窗體或使用者控制元件上後,我們就可以使用上下文選單(context menus)、bar manager的定製視窗或它的設計器來建立工具條和工具條命令(bar commands)了。

相關控制元件屬性

1.1.2、Toolbars

       工具條是一個可視的控制元件,它用來顯示各個專案連結。我們可以在工具條內顯示由XtraBars庫提供的任意專案連結,比如:按鈕(buttons),靜態文字(static text),子選單(submenu)、編輯器(editors)等等。

1.1.3、 Bar Items

    為了把多種元素(比如按鈕,子選單,標籤,編輯器等)新增到工具條和選單,我們需要建立合適的bar items。一個bar item是一個實現了特定功能的非可見物件。它定義了一個相應的元素如何顯示在螢幕上,並決定了對滑鼠單擊事件的相應。

    我們可以使用bar manager的Customize窗體上的Commands頁來建立bar items。為 了在邏輯上組織這些item,我們經常將它們分類。該窗體的左側皮膚裡顯示了有效的目錄,右側皮膚顯示了屬於當前選中目錄的各個bar item。選中一 個bar item可以在屬性視窗看到其屬性。

 

1.1.4、Popup Menus

使用彈出選單(popup menus),我們可以在控制元件上顯示上下文選項或命令。彈出選單是一個顯示了特定項的窗體,使用者可以選擇這些項以執行相應的操作。使用PopupMenu控制元件就可以在我們的應用程式中使用彈出選單。

通過BarManager的“名稱”+“上的PopupContenxtMenu”屬性繫結PopuMenus控制元件

   注意:

   在定製和使用popup menu之前,向窗體上新增一個bar manager並確保這個popup menu繫結 了這個bar manager。預設情況下,在設計時(at design time)新增到窗體的彈出選單會自動地尋找窗體內的 bar manager,

如果找到的話,會通過PopupMenu.Manager屬性將其繫結到bar manager。如果沒有自動繫結到bar manager,那就通過PopupMenu.Manager屬性手動繫結。

 

1.1.5、Categories

    XtraBars允許我們將bar items在邏輯上劃分為不同的類別(categories)。每個類別都是一 組item,並且每個item都只屬於一個類別(category)。類別不會對該類的item附加任何約束,分類只是為了對item進行有組織的訪問。

用BarManagerCategory類表示一個類別。我們通過BarManager.Categories集合來新增、移除、存取類別。使用BarItem.Category屬性,我們可以為每個item分配一個類別。

 

1.1.6、Bar Dock Controls

   工具條停放控制元件(bar dock controls)是工具條(toolbar)的容器,它們位於窗體或使用者控制元件內用以容納工具條物件。有regular和standalone兩種工具條停放控制元件。

       regular bar dock controls是由BarManager自動維護的,我們不用手動去建立它們。它們停靠在容器(比如窗體)的任意一邊,以顯示工具條。

       BarManager中的StandaloneBarDockControl屬性用來在窗體內的任何位置顯示工具條。我們需要手動繫結StandaloneBarDockControl控制元件

1.1.6.1 Regular Bar Dock Controls

       當工具條停靠於容器(比如form)的任意一邊時,regular bar dock controls將工 具條的停靠位置顯示出來。當建立 Bar Manager時,它會自動建立4個regular dock controls,並將它們停靠在窗體的相應邊 緣。

       只有當一個工具條停放在一個dock control上時,這個dock  control才是可見的。其他 情況下,dock  control的寬度都是0。當將工具條拖動到窗體的任意一邊時,相應的dock controls會容納並顯示這個工具條。 Bar.CanDockStyle屬性可以指定工具條的可能停放位置。

       一般情況下,在應用程式中是沒有必要去改變regular dock controls的屬性的。除非我們想 要為停靠的工具條提供背景設定。Bar Manager會自動建立名為barDockControl1...barDockControl4的4個 dock controls。每個dock control都是一個BarDockControl類。在設計時,我們通過在屬性視窗選擇相應的物件來訪問 dock control。此外,如果dock control是可見的,並且沒有完全被工具條覆蓋,我們可以單擊選中它,以在屬性視窗中顯示它。

 

1.1.6.2 Standalone Bar Dock Controls

    Standalone bar dock controls允許工具條停靠在窗體或使用者控制元件上的任意位置,而不僅僅是窗體的邊緣。建立一個StandaloneBarDockControl物件並且將工具條新增到其上就能做到這種效果。

   像regular control一樣,standalone bar dock controls可以在窗體或使用者 控制元件中隨意放置。它們的Dock、Location和Size屬性用來指定佈局設定。 StandaloneBarDockControl.AutoSize屬性用來啟用自動調整大小模式。在這種模式下,當向該控制元件新增或刪除工具條時,該控 件的大小是自動變化的。

    使用Standalone bar dock controls的前提是該窗體或使用者控制元件上已新增了 BarManager控制元件。如果我們以編碼的方式建立了StandaloneBarDockControl物件,那麼我們就需要手動將其新增到 BarManager的BarManager.DockControls集合中。

1.2 Bar Manager 的使用

1.2.1 Toolbars Customization

        為了在窗體上建立bar和bar  items,我們需要往窗體上新增一個BarManager控制元件。

1.2.1.1 creating bars and bar items on the form at design time

     在設計時(at design time),當把BarManager新增到窗體上後,會自動建立三個空工具條,分別是:窗體頂部的主選單欄、工具欄和窗體底部的狀態列。

    主選單欄通常是一個位於窗體頂部的工具條,其他的工具條不能和主選單欄位於同一行。終端使用者也不能關閉主選單欄。默 認情況下,使用者可以拖拽主選單欄,將其停靠至窗體的任意邊緣。主選單欄被賦予至BarManager.MainMenu屬性。狀態列通常是一個位於窗體底 部的工具條。使用者不能拖動該工具條。BarManager.StatusBar屬性賦值為該狀態列。在一個窗體上只有一個主選單和一個狀態列。

    預設情況下,工具條上有[Add]上下文連結(context links)。通過該連結,我們可以將bar items新增到工具條上。我們可以單擊[Add]連結來啟用bar item列表,然後從中選擇需要的bar item。

 

    選擇一個item後,它即被新增到工具條上,同時文字編輯器也被啟用。在此文字編輯器裡我們可以編輯新新增項的名字。

 

    按Enter鍵來結束編輯和該項的新增。

     如果我們要新增一個子選單(submenu),那麼先選擇sub-menu以新增選單項,然後再次單擊它,並通過[Add]新增新的bar item。

     若想在設計時隱藏[Add]上下文連結,右擊BarManager控制元件,然後勾去“show design time enhancements"選項即可。勾選這個選項,[Add]連結又會出現。

 

1.2.1.2 creating bars and bar items using the customization window

    右擊滑鼠,使用BarManager的Customization視窗是向窗體新增工具條和bar items的另一種方式。

1)Manipulate Bars

    切換到Customization視窗的Toolbars頁,單擊new,即可新增工具條。選擇工具條列表中的一個,點選delete,即可刪除該工具條。只有在執行時,Rename和Reset按鈕才處於啟用狀態。

2)Adding Bar Items

    切換到Commands頁,點選modify按鈕,然後選擇Add選單項,Add New BarItem對話方塊就會出現。在該對話方塊裡,我們可以指定該項的分類、名字、標題(caption)等。當新的item建立後,我們就可以把它拖放到工具條上。

 

1.2.1.3 creating bars using the barmanager's designer

BarManager的設計器也是用來新增、刪除、自定義設定工具條的一種方式。切換到Toolbars頁,單擊Add New Toolbar和Delete Toolbar按鈕即可建立或刪除工具條。

1.2.1.4 customizing items and links at design time

   在設計時,當你選擇一個連結(link),它就會在屬性視窗中顯示相應item的設定;

  如果改變這個item的外觀設定(appearance setting)就會影響到該item的所有屬性沒有顯性設定的連結。為了避免對這些連結造成影響,我們可以這樣做:

  在設計時,右擊這個連結,通過彈出的選單來改變設定。

  

選項                                                                 描述

 

Reset                        重置該連結的所有自定義設定。選中該選項後,這個連結的外觀就會由相應item的外觀設定控制。也可在程式碼中,呼叫BarItemLink.Reset方法以   

                                  將其恢復到預設值。

Delete                      刪除該連結。呼叫BarItemLink.Dispose方法也可達到該目的。

Change Caption     改變item 的標題。該值會應用於所有User caption沒有設定的link。這個選項對應於BarItemLink.Caption屬性。

change user            為某一link賦自定義標題,這樣就覆蓋了預設的item的標題。User caption只賦值於當前的link。該選項對應於BarItemLink.UserCaption。

caption

Default style           為某link設定預設的樣式。每個link的的預設樣式都可以是不同的。使用BarItemLink.PaintStyle屬性來在程式碼裡設定paint style.

Text only                  專案連結(item link)被繪製為文字。

(always)

Text only                 item link 在選單裡被繪製為文字,在工具條裡被繪製為圖片。

(in menus)

Image and Text      item  link被繪製為圖片和文字。

Begin a  Group       在選中的link錢插入一分隔符,以將item links邏輯分組。該選項對應於BarItemLink.BeginGroup屬性。

Visible                      決定一個item link是否可見。該選項對應於BarItemLink.Visible屬性。

Most recently         決定一個item是否指向最經常使用的link。勾選掉這個選項後,就會使該link位於最近使用項列表的底部。該選項對應用                              

    used                      BarItemLink.MostRecentlyUsed屬性。

1.2.1.5 How to obtain a value of the BarEditItem during editing

Object  value=(barManager1.ActiveEditor as DevExpress.XtraEditors.ButtonEdit).EditValue;

1.3RibbonControl

1.3.1How to: Create a RibbonControl in Code

1 

using DevExpress.XtraBars.Ribbon;

using DevExpress.XtraBars;

 

// Create a RibbonControl

RibbonControl RibbonControl = new RibbonControl();         

this.Controls.Add(RibbonControl);

// Assign the image collection that will provide images for bar items.

RibbonControl.Images = imageCollection1;

 

// Create a Ribbon page.

RibbonPage page1 = new RibbonPage("Home");

// Create a Ribbon page group.

RibbonPageGroup group1 = new RibbonPageGroup("File");

// Create another Ribbon page group.

RibbonPageGroup group2 = new RibbonPageGroup("File 2");

 

// Create a button item using the CreateButton method.

// The created item is automatically added to the item collection of the RibbonControl.

BarButtonItem itemOpen = RibbonControl.Items.CreateButton("Open...");

itemOpen.ImageIndex = 7;

itemOpen.ItemClick += new ItemClickEventHandler(itemOpen_ItemClick);

 

// Create a button item using its constructor.

// The constructor automatically adds the created item to the RibbonControl's item collection.

BarButtonItem itemClose = new BarButtonItem(RibbonControl.Manager, "Close");

itemClose.ImageIndex = 12;

itemClose.ItemClick += new ItemClickEventHandler(itemClose_ItemClick);

 

// Create a button item using the default constructor.

BarButtonItem itemPrint = new BarButtonItem();

// Manually add the created item to the item collection of the RibbonControl.

RibbonControl.Items.Add(itemPrint);

itemPrint.Caption = "Print";         

itemPrint.ImageIndex = 9;

itemPrint.ItemClick += new ItemClickEventHandler(itemPrint_ItemClick);

 

// Add the created items to the group using the AddRange method. 

// This method will create bar item links for the items and then add the links to the group.

group1.ItemLinks.AddRange(new BarItem[] { itemOpen, itemClose, itemPrint});

// Add the Open bar item to the second group.

group2.ItemLinks.Add(itemOpen);

// Add the created groups to the page.

page1.Groups.Add(group1);

page1.Groups.Add(group2);

// Add the page to the RibbonControl.

RibbonControl.Pages.Add(page1); void itemPrint_ItemClick(object sender, ItemClickEventArgs e) {

   //...

}

 

void itemClose_ItemClick(object sender, ItemClickEventArgs e) {

   //...

}

 

void itemOpen_ItemClick(object sender, ItemClickEventArgs e) {

}

1.3.1其他操作

1、如何顯示選中的頁

          ribbonControl1.SelectedPage = ribbonPage2;

2、如何繫結ApplicationMenus和PopupMenu:通過ribbonControl上的PopuContextMenu進行繫結;

1.4GalleryContral

控制元件可顯示影像,同時讓你將它們分類。

效果圖:

 

例1:

using DevExpress.XtraBars.Ribbon;

using DevExpress.Utils;

using DevExpress.Utils.Drawing;

 

GalleryControl gc = new GalleryControl();

gc.Dock = DockStyle.Fill;

this.Controls.Add(gc);

 

Image im1 = Image.FromFile("c:\\Images\\BMW.jpg");

Image im2 = Image.FromFile("c:\\Images\\Ford.jpg");

Image im3 = Image.FromFile("c:\\Images\\MercedecBenz.jpg");

Image im4 = Image.FromFile("c:\\Images\\AnneDodsworth.jpg");

Image im5 = Image.FromFile("c:\\Images\\HannaMoos.jpg");

Image im6 = Image.FromFile("c:\\Images\\JanetLeverling.jpg");

 

gc.Gallery.ItemImageLayout = ImageLayoutMode.ZoomInside;

gc.Gallery.ImageSize = new Size(120, 90);

gc.Gallery.ShowItemText = true;

 

GalleryItemGroup group1 = new GalleryItemGroup();

group1.Caption = "Cars";

gc.Gallery.Groups.Add(group1);

 

GalleryItemGroup group2 = new GalleryItemGroup();

group2.Caption = "People";

gc.Gallery.Groups.Add(group2);

 

group1.Items.Add(new GalleryItem(im1, "BMW", ""));

group1.Items.Add(new GalleryItem(im2, "Ford", ""));

group1.Items.Add(new GalleryItem(im3, "Mercedec-Benz", ""));

 

group2.Items.Add(new GalleryItem(im4, "Anne Dodsworth", ""));

group2.Items.Add(new GalleryItem(im5, "Hanna Moos", ""));

group2.Items.Add(new GalleryItem(im6, "Janet Leverling", ""));

 

 

1.4 GroupControl控制元件

實現效果如圖:

 

該控制元件的ShowCaption屬性,是bool型別,當其值為false時,表示不顯示標題;

 

該控制元件的CaptionImage屬性可以設定標題前的圖片顯示,例如:

 this.groupControl1.CaptionImage=global::WindowsDev.Properties.Resources.additem_32x32;

 

該控制元件的LookAndFeel屬性下的UseDefaultLookAndFeel屬性控制是否可以對黨情的皮膚進行設定,為bool型別;

 

該控制元件的BorderStyle屬性控制控制元件的邊框樣式:

如第一個圖的效果程式碼如下:

            groupControl1.BackColor = Color.LightGray;

            groupControl1.LookAndFeel.UseDefaultLookAndFeel =false ;

            groupControl1.ShowCaption = true;

      groupControl1.BorderStyle=  DevExpress.XtraEditors.Controls.BorderStyles.Simple;

 

1.5 SplitContainerControl控制元件

實現效果如圖:

 

該控制元件的PanelVisibility屬性控制皮膚Panel1和皮膚Panel2的可見性,

程式碼如下:

splitContainerControl2.PanelVisibility=

DevExpress.XtraEditors.SplitPanelVisibility.Panel1;//僅Panel1可見

splitContainerControl2.PanelVisibility=

DevExpress.XtraEditors.SplitPanelVisibility.Both;//Panel1、Panel2都可見

該控制元件的Horizontal屬性控制皮膚是成左右分割還是上下分割,其值為true表示成左右分割佈局;

該控制元件的LookAndFeel屬性提供了改變控制元件外觀的許可權,該屬性下的UseDefaultLookAndFeel為false時,可以通過該控制元件的Appearance屬性對外觀進行設定;

1.6 AlertControl控制元件 

   AlertControl控制元件能改在應用程式中顯示警告視窗,通常該警告視窗顯示為一個短的事件並自動關閉可以在該視窗中指定標題、文字、影像,並定義相應的處理事件。

實現效果如圖:

 

實現程式碼如下:

using DevExpress.XtraBars.Alerter;

 

// Create a regular custom button.

AlertButton btn1 = new AlertButton(Image.FromFile(@"c:\folder-16x16.png"));

btn1.Hint = "Open file";

btn1.Name = "buttonOpen";

// Create a check custom button.

AlertButton btn2 = new AlertButton(Image.FromFile(@"c:\clock-16x16.png"));

btn2.Style = AlertButtonStyle.CheckButton;

btn2.Down = true;

btn2.Hint = "Alert On";

btn2.Name = "buttonAlert";

// Add buttons to the AlertControl and subscribe to the events to process button clicks

alertControl1.Buttons.Add(btn1);

alertControl1.Buttons.Add(btn2);

alertControl1.ButtonClick+=new AlertButtonClickEventHandler(alertControl1_ButtonClick);

alertControl1.ButtonDownChanged += 

    new AlertButtonDownChangedEventHandler(alertControl1_ButtonDownChanged);

 

// Show a sample alert window.

AlertInfo info = new AlertInfo("New Window", "Text");

alertControl1.Show(this, info);

 

void alertControl1_ButtonDownChanged(object sender, 

AlertButtonDownChangedEventArgs e) {

    if (e.ButtonName == "buttonOpen") {

        //...

    }

}

 

void alertControl1_ButtonClick(object sender, AlertButtonClickEventArgs e) {

    if (e.ButtonName == "buttonAlert") {

        //...

    }

}

1.7  XtraTabControl控制元件

1、該控制元件的TabPage屬性:以集合的形式儲存page頁;

使用程式碼新增頁:using DevExpress.XtraTab;

        XtraTabPage page = new XtraTabPage();

            page.Text = "aa";

           xtraTabControl1.TabPages.Add(page);

 

2、該控制元件的MultiLine屬性:把其值設為true;當可用空間不適應顯示的頁標題的長度時,允許頁頭進行多行顯示.

 

3、SelectedTabPage屬性:設定預設情況下顯示的頁;

4、ClosePageButttonShowMode屬性:該屬性控制那一頁上顯示關閉按鈕,示例程式碼如下:

  this.xtraTabControl1.ClosePageButtonShowMode = DevExpress.XtraTab.ClosePageButtonShowMode.InActiveTabPageAndTabControlHeader;

效果如圖:

 

5、HeaderButton屬性:可以通過該屬性設定該控制元件右上角顯示的按鈕,可以新增 Close, Next 和Prev buttons.

1.8 TitleControl控制元件

該控制元件是根據Windows 8的使用者介面設計的,可以輕鬆地把各個控制塊整合到窗體上。

1.IndertBetweenGroups屬性:控制兩個Group之間的間距;

2.該控制元件通過TileGroupTileItems新增GroupItem

3、該控制元件通過TileControl.ItemClick事件執行選中的Item後執行的操作;

示例程式碼1

  using DevExpress.XtraEditors;

 TileItem newTile = new TileItem();

  tileControl1.Groups.Add(new TileGroup());

  tileControl1.Groups[0].Items.Add(newTile);

示例程式碼2:

 TileItem newTile = new TileItem();

            //First Frame - Image only

            TileItemFrame logoDXFrame = new TileItemFrame();

            TileItemElement logoEl = new TileItemElement();

            logoEl.Image = global::WindowsDev.Properties.Resources.additem_32x32; logoEl.ImageAlignment = TileItemContentAlignment.MiddleCenter;

            logoDXFrame.Elements.Add(logoEl);

            logoDXFrame.Elements[0].AnimateTransition= DevExpress.Utils.DefaultBoolean.True;

            //Second Frame - Text only

            TileItemFrame mottoDXFrame = new TileItemFrame();

            TileItemElement mottoEl = new TileItemElement();

            mottoEl.Text = "<Size=+2><Color=Sienna><b>Let's see what develops.</b></Color></Size>";

            mottoEl.TextAlignment = TileItemContentAlignment.MiddleCenter;

            mottoDXFrame.Elements.Add(mottoEl);

            mottoDXFrame.Elements[0].AnimateTransition= DevExpress.Utils.DefaultBoolean.True;

            //Global Tile Item Settings

            newTile.Frames.Add(logoDXFrame);

            newTile.Frames.Add(mottoDXFrame);

            newTile.Appearance.BackColor = System.Drawing.Color.Bisque;

            newTile.Appearance.BackColor2 = System.Drawing.Color.SandyBrown;

            newTile.Appearance.GradientMode= System.Drawing.Drawing2D.LinearGradientMode.BackwardDiagonal;

            newTile.Appearance.BorderColor = System.Drawing.Color.Bisque;

            newTile.AllowHtmlText = DevExpress.Utils.DefaultBoolean.True;

            newTile.FrameAnimationInterval = 2500;

            newTile.IsLarge = true;

            tileControl1.Groups.Add(new TileGroup());

            tileControl1.Groups[0].Items.Add(newTile);

            newTile.StartAnimation();

 

效果圖如下:

 

1.9 RadialMenu控制元件

該控制元件是圓形選單,可以以選單的形式新增選單項;

該控制元件的ShowPopup(Point point)方法用於顯示圓形選單;

2.0 PopupControlContainer控制元件

PopupControlContainer控制元件可以以皮膚的形式包含其他控制元件,可以DropDownButton控制元件的下拉框的格式出現,具體形式如圖:

 

PopupControlContainer控制元件通過DropDownButton控制元件的DropDownControl屬性進行繫結,在繫結後PopupControlContainer控制元件的AllowDrop屬性要設成True;

 

2.1 HScrollBar控制元件和VScrollBar控制元件

許多控制元件需要滾動條,像ListBoxControl、CheckedListControl控制元件中已經整合啦滾動條,所以 就不需要另加滾動條,但有些控制元件沒有整合,像PictureEdit控制元件,當顯示的圖片過長時,不能在其已有的區域顯示,就需要HScrollbar控制元件 和VScrollBar控制元件;

示例程式碼:

using DevExpress.XtraEditors;

private void Form1_Load(object sender, System.EventArgs e) {

   hScrollBar1.Width = pictureBox1.Width;

   hScrollBar1.Left = pictureBox1.Left;

   hScrollBar1.Top = pictureBox1.Bottom;

   hScrollBar1.Maximum = pictureBox1.Image.Width - pictureBox1.Width;

   vScrollBar1.Height = pictureBox1.Height;

   vScrollBar1.Left = pictureBox1.Left + pictureBox1.Width;

   vScrollBar1.Top = pictureBox1.Top;

   vScrollBar1.Maximum = pictureBox1.Image.Height - pictureBox1.Height;

}

 

int x = 0;

private void hScrollBar1_Scroll(object sender, System.Windows.Forms.ScrollEventArgs e) {

   x = hScrollBar1.Value;

   pictureBox1.Refresh();

}

 

int y = 0;

private void vScrollBar1_Scroll(object sender, System.Windows.Forms.ScrollEventArgs e) {

   y = vScrollBar1.Value;

   pictureBox1.Refresh();

}

private void pictureBox1_Paint(object sender, System.Windows.Forms.PaintEventArgs e) {

   e.Graphics.DrawImage(pictureBox1.Image, e.ClipRectangle, x, y, e.ClipRectangle.Width, 

     e.ClipRectangle.Height, GraphicsUnit.Pixel);

}

顯示效果:

 

2.2DocumenManger控制元件

   MDI子窗體可以通過DocumentManger控制元件以nativemdiview物件或tabbedview物件的形式展現出來;

   通過其ViewCollection屬性新增View檢視(子窗體),可以新增TabbedViewWindowsUIViewWidgetViewNativeMdiView四種檢視;

通過Run DesignerMain下的Document給檢視新增Document文件(顯示的皮膚);

NativeMdiView檢視)通過程式碼實現如下:

using System;

using System.Collections.Generic;

using System.ComponentModel;

using System.Data;

using System.Drawing;

using System.Text;

using System.Windows.Forms;

using DevExpress.XtraBars.Docking2010;

using DevExpress.XtraBars.Docking2010.Views.NativeMdi;

using DevExpress.XtraEditors;

 

namespace DocumentManager_NativeMDI {

    public partial class Form1 : Form {

        public Form1() {

            InitializeComponent();

        }

        int childCount = 0;

        private void Form1_Load(object sender, EventArgs e) {

            CreateDocumentManager();

            for(int i = 0; i < 3; i++) {

                AddChild();

            }

        }

        void CreateDocumentManager() {

            DocumentManager dm = new DocumentManager();

            dm.MdiParent = this;

            dm.View = new NativeMdiView();

        }

        void AddChild() {

            Form childForm = null;

            childForm = new Form();

            childForm.Text = "Child Form " + (++childCount);

 

            SimpleButton btn = new SimpleButton();

            btn.Text = "Button " + childCount;

            btn.Parent = childForm;

 

            childForm.MdiParent = this;

            childForm.Show();

        }

    }

}

實現效果如圖:

 

TabbedView檢視)通過程式碼實現如下:

using System;

using System.Windows.Forms;

using DevExpress.XtraBars.Docking2010;

using DevExpress.XtraBars.Docking2010.Views.Tabbed;

using DevExpress.XtraEditors;

 

namespace DocumentManager_TabbedUI {

    public partial class Form1 : Form {

        public Form1() {

            InitializeComponent();

        }

        void Form1_Load(object sender, EventArgs e) {

            AddDocumentManager();

            for(int i = 0; i < 3; i++) {

                AddChildForm();

            }

        }

        void AddDocumentManager() {

            DocumentManager manager = new DocumentManager();

            manager.MdiParent = this;

            manager.View = new TabbedView();

        }

        int count;

        void AddChildForm() {

            Form childForm = new Form();

            childForm.Text = "Child Form " + (++count).ToString();

 

            SimpleButton btn = new SimpleButton();

            btn.Text = "Button " + count.ToString();

            btn.Parent = childForm;

 

            childForm.MdiParent = this;

            childForm.Show();

        }

    }

}

實現效果如圖:

 

2.Data & Analytics

 2.1DataNavigator

2.1.1繫結資料來源:

       例:List<int> datasource = new List<int>();

            datasource.AddRange(new int[] { 0, 1, 2, 3, 4 });

            myDataNavigator1.DataSource = datasource;

2.2GridLookUpEdit

2.1.2示例程式碼:

using DevExpress.XtraEditors;

using DevExpress.XtraGrid.Columns;

using System.Data.OleDb;

 

// A lookup editor created at runtime.

GridLookUpEdit gridLookup;

// A navigator control to navigate the "Order Details" table.

DataNavigator dataNav;

 

// DataView for the "Order Details" table.

DataView dvMain;

// DataView for the "Products" table.

DataView dvDropDown;

 

//...

 

 

private void Form1_Load(object sender, System.EventArgs e) {

   gridLookup = new GridLookUpEdit();

   gridLookup.Bounds = new Rectangle(10, 40, 200, 20);

   this.Controls.Add(gridLookup);

   

   dataNav = new DataNavigator();

   dataNav.Bounds = new Rectangle(10, 10, 250, 20);

   this.Controls.Add(dataNav);

 

   InitData();

   InitLookUp();

 

   dataNav.DataSource = dvMain;

}

 

private void InitData() {

   // Dataset to provide data from the database

   DataSet ds = new DataSet();

   string connestionString = 

     "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=C:\\DB\\nwind.mdb";

      

   // Connect to the "Order Details" table

   System.Data.OleDb.OleDbDataAdapter dbAdapter = 

     new OleDbDataAdapter("SELECT * FROM [Order Details]", connestionString);

   // Load data from the "Order Details" table to the dataset

   dbAdapter.Fill(ds, "Order Details");

   // Connect to the "Products" table

   dbAdapter = new OleDbDataAdapter("SELECT * FROM Products", connestionString);

   // Load data from the "Products" table into the dataset

   dbAdapter.Fill(ds, "Products");

 

   DataViewManager dvm = new DataViewManager(ds);                

   dvMain = dvm.CreateDataView(ds.Tables["Order Details"]);

   dvDropDown = dvm.CreateDataView(ds.Tables["Products"]);

}

 

 

private void InitLookUp() {

   // Bind the edit value to the ProductID field of the "Order Details" table;

   // the edit value matches the value of the ValueMember field.

   gridLookup.DataBindings.Add("EditValue", dvMain, "ProductID");

 

   // Prevent columns from being automatically created when a data source is assigned.

   gridLookup.Properties.View.OptionsBehavior.AutoPopulateColumns = false;

   // The data source for the dropdown rows

   gridLookup.Properties.DataSource = dvDropDown;

   // 下拉框顯示的欄位資料.

   gridLookup.Properties.DisplayMember = "ProductName";

   // The field matching the edit value.

   gridLookup.Properties.ValueMember = "ProductID";

 

   // Add two columns in the dropdown:

   // A column to display the values of the ProductID field;

   GridColumn col1 = gridLookup.Properties.View.Columns.AddField("ProductID");

   col1.VisibleIndex = 0;

   col1.Caption = "Product ID";

   // A column to display the values of the ProductName field.

   GridColumn col2 = gridLookup.Properties.View.Columns.AddField("ProductName");

   col2.VisibleIndex = 1;

   col2.Caption = "Product Name";

   

   // Set column widths according to their contents.

   gridLookup.Properties.View.BestFitColumns();

   // Specify the total dropdown width.

   gridLookup.Properties.PopupFormWidth = 300;         

}

 

2.3 GridControl

1、設計資料來源並繫結欄位:

             DataTable dt = new DataTable();

            dt.Columns.Add("name", System.Type.GetType("System.String"));

            dt.Columns.Add("sex", System.Type.GetType("System.String"));

            dt.Columns.Add("age", System.Type.GetType("System.String"));

           DataRow row=dt.NewRow();;

           row["name"] = "11";

           row["sex"] = "ss";

           row["age"] = "age";

           dt.Rows.Add(row);

  //繫結欄位

 gridView1.Columns[1].FieldName = "sex";

           gridView1.Columns[2].FieldName = "age";

           gridView1.Columns[0].FieldName = "name";

          gridControl1.DataSource = dt;

2、 如何解決單擊記錄整行選中的問題

View->OptionsBehavior->EditorShowMode 設定為:Click

 

3、 如何新增一條記錄

(1)、gridView.AddNewRow()

(2)、實現 gridView_InitNewRow 事件

 

4、如何解決 GridControl 記錄能獲取而沒有顯示出來的問題

gridView.populateColumns();

 

5、如何讓行只能選擇而不能編輯(或編輯某一單元格)

(1)、View->OptionsBehavior->EditorShowMode 設定為:Click

(2)、View->OptionsBehavior->Editable 設定為:false

 

6、如何禁用 GridControl 中單擊列彈出右鍵選單

設定 Run Design->OptionsMenu->EnableColumnMenu 設定為:false

 

7、如何隱藏 GridControl 的 GroupPanel 表頭

設定 Run Design->OptionsView->ShowGroupPanel 設定為:false

 

 

8、如何禁用 GridControl 中列頭的過濾器 過濾器如下圖所示:     

設定 Run Design->OptionsCustomization->AllowFilter 設定為:false

9、如何在查詢得到 0 條記錄時顯示自定義的字元提示/顯示 如圖所示:

 

方法如下:

//When no Records Are Being Displayed

 

private void gridView1_CustomDrawEmptyForeground(object sender, CustomDrawEventArgs e)

 

{

 

 //方法一(此方法為GridView設定了資料來源繫結時,可用)

 

 ColumnView columnView = sender as ColumnView;

 

BindingSource bindingSource = this.gridView1.DataSource as BindingSource;

 

if(bindingSource.Count == 0)

 

{

 

string str = "沒有查詢到你所想要的資料!";

 

Font f = new Font("宋體", 10, FontStyle.Bold);

 

Rectangle r = new Rectangle(e.Bounds.Top + 5, e.Bounds.Left + 5, e.Bounds.Right - 5, e.Bounds.Height - 5);

 

e.Graphics.DrawString(str, f, Brushes.Black, r); }

 

//方法二(此方法為GridView沒有設定資料來源繫結時,使用,一般使用此種方 法)

 

if (this._flag)

 

 {

 if (this.gridView1.RowCount == 0)

 

 { string str = "沒有查詢到你所想要的資料!"; Font f = new Font("宋體", 10, FontStyle.Bold);

 

Rectangle r = new Rectangle(e.Bounds.Left + 5, e.Bounds.Top + 5, e.Bounds.Width - 5, e.Bounds.Height - 5);

 

e.Graphics.DrawString(str, f, Brushes.Black, r); } } }

 

 

 

10、如何顯示水平滾動條

設定 this.gridView.OptionsView.ColumnAutoWidth = false;

列表寬度自適應內容

gridview1.BestFitColumns();

 

 

 

11、如何定位到第一條資料/記錄?

 

設定 this.gridView.MoveFirst()

12、如何定位到下一條資料/記錄? 設定 this.gridView.MoveNext()

13、如何定位到最後一條資料/記錄?

 

設定 this.gridView.MoveLast()

14、設定成一次選擇一行,並且不能被編輯

 

this.gridView1.FocusRectStyle = DevExpress.XtraGrid.Views.Grid.DrawFocusRectStyle.RowFocus;

 

 this.gridView1.OptionsBehavior.Editable = false;

 

this.gridView1.OptionsSelection.EnableAppearanceFocusedCell = false;

 

 

 

 15、如何顯示行號?   private void gvPayList_CustomDrawRowIndicator(object sender, DevExpress.XtraGrid.Views.Grid.RowIndicatorCustomDrawEventArgs e)         {             e.Appearance.TextOptions.HAlignment = DevExpress.Utils.HorzAlignment.Far;             if (e.Info.IsRowIndicator)             {                 if (e.RowHandle >= 0)                 {                     e.Info.DisplayText = (e.RowHandle + 1).ToString();                 }                 else if (e.RowHandle < 0 && e.RowHandle > -1000)                 {                     e.Info.Appearance.BackColor = System.Drawing.Color.AntiqueWhite;                     e.Info.DisplayText = "G" + e.RowHandle.ToString();                 }             }         }

 

 

 

16、如何讓各列頭禁止移動?

 

設定 gridView1.OptionsCustomization.AllowColumnMoving = false;

 

17、如何讓各列頭禁止排序?

 

設定 gridView1.OptionsCustomization.AllowSort = false;

 

18、如何禁止各列頭改變列寬?

 

設定 gridView1.OptionsCustomization.AllowColumnResizing = false;

 

 

 

19.拖動滾動條時固定某一列

 

設定Columns,選擇要固定的列。設定Fixed屬性,可以選擇:固定在左邊、固定在右邊、不固定。

 

 

 

20.獲取選定行,指定列單元格的內容

 

      return gridView1.GetRowCellValue(pRows[0], ColumName).ToString ();

 

21.分組顯示

 

OptionsView>OptionsBehavior>AutoExpandAllGroups = True 選擇要分組的列,將GroupIndex屬性設定為0

 

22.格式化資料

 

       private void gvList_ValidatingEditor(object sender, DevExpress.XtraEditors.Controls.BaseContainerValidateEditorEventArgs e)         {             if (this.gvList.FocusedColumn.FieldName == "passQty")             {                 string passQty = e.Value.ToString().Trim();                 int receiveQty = orderDetailList[this.gvList.FocusedRowHandle].qty;                 if (!JXType.IsIntBigThanZero(passQty))                 {                     e.Valid = false;                     e.ErrorText = "合格數量必須為大於等於0小於等於接貨數量的整數!";                 }                 else                 {                     if (int.Parse(passQty) > receiveQty)                     {                         e.Valid = false;                         e.ErrorText = "合格數量必須為大於0小於等於接貨數量的整數!";                     }                 }             }

 

}

 

 

 

23.合併表頭

 

介面操作:

 

   

程式碼操作如下:

示例程式碼1:

 private DevExpress.XtraGrid.Views.BandedGrid.BandedGridView bandedGridView1;

        private DevExpress.XtraGrid.Views.BandedGrid.GridBand gridBand1;

        private DevExpress.XtraGrid.Views.BandedGrid.BandedGridColumn gridColumn1;

        private DevExpress.XtraGrid.Views.BandedGrid.BandedGridColumn gridColumn2;

        private DevExpress.XtraGrid.Views.BandedGrid.GridBand gridBand2;

        private DevExpress.XtraGrid.Views.BandedGrid.BandedGridColumn gridColumn3;

        private DevExpress.XtraGrid.Columns.GridColumn gridColumn5;

 private DevExpress.XtraGrid.GridControl gridControl1;

 private void InitializeComponent()

        {

            this.gridControl1 = new DevExpress.XtraGrid.GridControl();

            this.button1 = new System.Windows.Forms.Button();

            this.button2 = new System.Windows.Forms.Button();

            this.gridColumn5 = new DevExpress.XtraGrid.Columns.GridColumn();

            this.bandedGridView1 = new DevExpress.XtraGrid.Views.BandedGrid.BandedGridView();

            this.gridColumn1 = new DevExpress.XtraGrid.Views.BandedGrid.BandedGridColumn();

            this.gridColumn2 = new DevExpress.XtraGrid.Views.BandedGrid.BandedGridColumn();

            this.gridColumn3 = new DevExpress.XtraGrid.Views.BandedGrid.BandedGridColumn();

            this.gridBand1 = new DevExpress.XtraGrid.Views.BandedGrid.GridBand();

            this.gridBand2 = new DevExpress.XtraGrid.Views.BandedGrid.GridBand();

            ((System.ComponentModel.ISupportInitialize)(this.gridControl1)).BeginInit();

            ((System.ComponentModel.ISupportInitialize)(this.bandedGridView1)).BeginInit();

            this.SuspendLayout();

            // 

            // gridControl1

            // 

            this.gridControl1.Location = new System.Drawing.Point(74, 46);

            this.gridControl1.MainView = this.bandedGridView1;

            this.gridControl1.Name = "gridControl1";

            this.gridControl1.Size = new System.Drawing.Size(400, 200);

            this.gridControl1.TabIndex = 0;

            this.gridControl1.ViewCollection.AddRange(new DevExpress.XtraGrid.Views.Base.BaseView[] {

            this.bandedGridView1});

            // 

            // button1

            // 

            this.button1.Location = new System.Drawing.Point(88, 333);

            this.button1.Name = "button1";

            this.button1.Size = new System.Drawing.Size(75, 23);

            this.button1.TabIndex = 1;

            this.button1.Text = "button1";

            this.button1.UseVisualStyleBackColor = true;

            this.button1.Click += new System.EventHandler(this.button1_Click);

            // 

            // button2

            // 

            this.button2.Location = new System.Drawing.Point(273, 332);

            this.button2.Name = "button2";

            this.button2.Size = new System.Drawing.Size(75, 23);

            this.button2.TabIndex = 2;

            this.button2.Text = "button2";

            this.button2.UseVisualStyleBackColor = true;

            this.button2.Click += new System.EventHandler(this.button2_Click);

            // 

            // gridColumn5

            // 

            this.gridColumn5.Name = "gridColumn5";

            // 

            // bandedGridView1

            // 

            this.bandedGridView1.Bands.AddRange(new DevExpress.XtraGrid.Views.BandedGrid.GridBand[] {

            this.gridBand1,

            this.gridBand2});

            this.bandedGridView1.Columns.AddRange(new DevExpress.XtraGrid.Views.BandedGrid.BandedGridColumn[] {

            this.gridColumn1,

            this.gridColumn2,

            this.gridColumn3});

            this.bandedGridView1.GridControl = this.gridControl1;

            this.bandedGridView1.Name = "bandedGridView1";

            // 

            // gridColumn1

            // 

            this.gridColumn1.Caption = "Name";

            this.gridColumn1.Name = "gridColumn1";

            this.gridColumn1.Visible = true;

            // 

            // gridColumn2

            // 

            this.gridColumn2.Caption = "Sex";

            this.gridColumn2.Name = "gridColumn2";

            this.gridColumn2.Visible = true;

            // 

            // gridColumn3

            // 

            this.gridColumn3.Caption = "Age";

            this.gridColumn3.Name = "gridColumn3";

            this.gridColumn3.Visible = true;

            // 

            // gridBand1

            // 

            this.gridBand1.Caption = "gridBand1";

            this.gridBand1.Columns.Add(this.gridColumn1);

            this.gridBand1.Columns.Add(this.gridColumn2);

            this.gridBand1.Name = "gridBand1";

            this.gridBand1.VisibleIndex = 0;

            this.gridBand1.Width = 150;

            // 

            // gridBand2

            // 

            this.gridBand2.Caption = "gridBand2";

            this.gridBand2.Columns.Add(this.gridColumn3);

            this.gridBand2.Name = "gridBand2";

            this.gridBand2.VisibleIndex = 1;

            this.gridBand2.Width = 75;

            // 

            // Form8

            // 

            this.AutoScaleDimensions = new System.Drawing.SizeF(6F, 12F);

            this.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font;

            this.ClientSize = new System.Drawing.Size(590, 429);

            this.Controls.Add(this.button2);

            this.Controls.Add(this.button1);

            this.Controls.Add(this.gridControl1);

            this.Name = "Form8";

            this.Text = "Form8";

            ((System.ComponentModel.ISupportInitialize)(this.gridControl1)).EndInit();

            ((System.ComponentModel.ISupportInitialize)(this.bandedGridView1)).EndInit();

            this.ResumeLayout(false);

 

        }

示例程式碼2:

///初始化表格

 

using DevExpress.XtraGrid.Columns; using DevExpress.XtraGrid.Views.Base; using DevExpress.XtraGrid.Views.BandedGrid; using DevExpress.XtraEditors.Repository;         private void InitGrid()         {             // advBandedGridView1是表格上的預設檢視,注意這裡宣告的  是:BandedGridView             BandedGridView view = advBandedGridView1 as BandedGridView;             view.BeginUpdate(); //開始檢視的編輯,防止觸發其他事件             view.BeginDataUpdate(); //開始資料的編輯             view.Bands.Clear();

 

            view.OptionsView.ShowColumnHeaders = false;                         // 因為有Band列了,所以把ColumnHeader隱藏             //新增列標題       //新增列標題             GridBand bandID = view.Bands.AddBand("ID");             bandID.Visible = false; //隱藏ID列             GridBand bandName = view.Bands.AddBand("姓名");             GridBand bandSex = view.Bands.AddBand("性別");             GridBand bandBirth = view.Bands.AddBand("出生日期");             GridBand bandScore = view.Bands.AddBand("分數");             GridBand bandMath = bandScore.Children.AdBand("數學");             GridBand bandChinese = bandScore.Children.AddBand("語文");             GridBand bandEnglish = bandScore.Children.AddBand("英語");             GridBand bandSubTotal = bandScore.Children.AddBand("小計");             GridBand bandRemark = view.Bands.AddBand("備註");

 

            bandFile.AppearanceHeader.TextOptions.HAlignment = DevExpress.Utils.HorzAlignment.Center; //這是合併表頭居中顯示             view.EndDataUpdate();//結束資料的編輯             view.EndUpdate();   //結束檢視的編輯         }

具體可看 

dev gridcontrol 合併表頭

 

 

24、   //動態新增列             DevExpress.XtraGrid.Columns.GridColumn Col1 = new DevExpress.XtraGrid.Columns.GridColumn();             Col1.FieldName = "name";             Col1.Caption = "名字";             Col1.Visible = false;             Col1.VisibleIndex = gvCountry.Columns.Count;             gvCountry.Columns.Add(Col1);

 

25、設定自動增加的行號

  private void gridview_CustomDrawRowIndicator(object sender,                            DevExpress.XtraGrid.Views.Grid.RowIndicatorCustomDrawEventArgs e)     {

e.Appearance.TextOptions.HAlignment = DevExpress.Utils.HorzAlignment.Far;             if (e.Info.IsRowIndicator)             {                 if (e.RowHandle >= 0)                 {                     e.Info.DisplayText = (e.RowHandle + 1).ToString();                 }                 else if (e.RowHandle < 0 && e.RowHandle > -1000)                 {                     e.Info.Appearance.BackColor = System.Drawing.Color.AntiqueWhite;                     e.Info.DisplayText = "G" + e.RowHandle.ToString();                 }             }

26、特效:gridcontrol中有5種view 型式,普通的是gridview,然後分別為cardview、BandedView、Advanced BandedView、LayoutView;共5種。

  1)、view組中把OptionView下的viewmode 設定成“Carousel”就達到這種“旋轉木馬”式 的gridcontrol view 特效了   2)、layoutView1.OptionsCarouselMode.PitchAngle 這個屬性決定“旋轉木馬”的 pitch angle 螺距角; 螺旋角; 螺旋升角; 俯仰角; 傾角; 節錐半形    3)、Roll Angle 屬性決定著 傾側角度   4)、指定資料來源,顯示資料:   //顯示資料         private void showData(List<Employee > list)         {             DataTable dt = new DataTable("OneEmployee");             dt.Columns.Add("Caption", System.Type.GetType("System.String"));             dt.Columns.Add("Department", System.Type.GetType("System.String"));             dt.Columns.Add("PhotoName", System.Type.GetType("System.Byte[]"));

            for (int i = 0; i < list.Count; i++)             {                 DataRow dr = dt.NewRow();                 dr["Caption"] = list[i].Name;                 dr["Department"] = list[i].Department;                 string imagePath = @"D:\C#\photos\" + list[i].PhotoPath;                 dr["PhotoName"] = getImageByte(imagePath);                 dt.Rows.Add(dr);             }             gridControl1.DataSource = dt;         }

        //返回圖片的位元組流byte[]         private byte[] getImageByte(string imagePath)         {             FileStream files = new FileStream(imagePath, FileMode.Open);             byte[] imgByte = new byte [files.Length ];             files.Read(imgByte, 0, imgByte.Length);             files.Close();             return imgByte;         }

 

27、檢查資料的有效性

  在gridview的ValidateRow事件中加入檢查程式碼:   #region 檢查資料   private void gridView1_ValidateRow(object sender, ValidateRowEventArgs e)   {   GridView view = sender as GridView;   view.ClearColumnErrors();

  if (view.GetRowCellValue(e.RowHandle, "ReceiveDate") == DBNull.Value)   {   e.Valid = false;   view.SetColumnError(view.Columns["ReceiveDate"], "必須指定日期");   }

  }

 

28、設某一列文字和標題局中顯示                      gridView1.Columns[0].AppearanceHeader.TextOptions.HAlignment = DevExpress.Utils.HorzAlignment.Center;    gridView1.Columns[0].AppearanceCell.TextOptions.HAlignment = DevExpress.Utils.HorzAlignment.Center;

 

 

 

29、列表過濾條件多選

列名.OptionsFilter.FilterPopupMode= DevExpress.XtraGrid.Columns.FilterPopupMode.CheckedList

 

30、隔行換色的方法

// 設定奇數行顏色,預設也是白色 可以省略 

 this.gridView1.Appearance.OddRow.BackColor = Color.White;  

//使所以的奇數行能上面繫結 同時使用有效  this.gridView1.OptionsView.EnableAppearanceOddRow = true;  

// 設定偶數行顏色  this.gridView1.Appearance.EvenRow.BackColor = Color.WhiteSmoke; 

//使所以的偶數行能上面繫結 同時使用有效  this.gridView1.OptionsView.EnableAppearanceEvenRow = true;  

 

31、刪除選中行,新增行

 刪除選中行通過DeleteSelectedRows()方法,可以通過AddNewRow()方法新增行;

具體示例程式碼如下:

 

if (gridView1.SelectedRowsCount > 0)

{

     gridView1.DeleteSelectedRows();

}

32、設定只讀屬性

通過OptionColumn的readOnly屬性,把某一列設定為只讀屬性;

this.gridView1.Columns[0].OptionsColumn.ReadOnly = true;

 

2.4 TreeList控制元件

樹列表,該事件的AfterCheckNode事件是當選擇CheckBox時所觸發的事件;

示例程式碼:

 /// <summary>

    /// 實體類

    /// </summary>

    class PersonTo

    {

        public string Name

        {

            set;

            get;

        }

        public string Age

        {

            set;

            get;

        }

 

}

//繫結資料來源,新增節點

 private void AddTreeNode()

        {

            ArrayList pl = new ArrayList();

            PersonTo p = new PersonTo();

            p.Name = "liu";

            p.Age = "20";

            pl.Add(p);

            PersonTo p2 = new PersonTo();

            p2.Name = "yu";

            p2.Age = "21";

            pl.Add(p2);

            treeList1.DataSource=pl;

           object[] s = new object[] { "1", "1", "1" };

           object ss = new object();

           this.treeList1.AppendNode(s,0);

}

 

1、該控制元件下的OptionsView屬性下的ShowCheckBoxes屬性控制是否每項前顯示CheckBox,該屬性屬於bool型別

 

 

3、Common Controls

3.1 TextEdit控制元件

以文字框的形式繫結各種形式的選擇框;

文字框設定輸入字元時有* 號掩蓋輸入的字元,程式碼如下:

textEdit1.Propertiex.PasswordChar=’*’;

 

3.2 ButtonEdit控制元件

以button按鈕的形式繫結各種形式的選擇框;

 

3.3 CheckButton控制元件

以按鈕的形式顯示Check的操作;

 

3.3.1其Button Style屬性設定Checked和UnChecked時的樣式;

可以在其DX Image Gallery中用其內不的自帶圖片,當Check的狀態發生改變時可以用

  this.checkButton1.Image = global::WindowsDev.Properties.Resources.clear_32x32;改變其內部自帶的圖片

 

3.4 ListBoxControl控制元件

示例程式碼:

string[] States = { "Alabama", "Alaska" };             

// Initialize and create an instance of the ListBoxControl class

ListBoxControl listBox = new ListBoxControl();

// Define the parent control

listBox.Parent = this;

// Set the listBox's background color

listBox.BackColor = Color.FromArgb(254, 246, 212);

// Dock to all edges and fill the parent container

listBox.Dock = DockStyle.Fill;

// Add items

listBox.Items.AddRange(States);

 

3.15 DropDownButton控制元件

    該控制元件以按鈕的形式彈出上下文選單,該控制元件通過DropDownControl屬性繫結PopuMenu控制元件或PopupControlContainer控制元件。

    可以通過該控制元件的DropDownArrowStyle屬性控制下拉箭頭的顯示模式,如圖:

 

 

3.6 PictureEdit控制元件

可在控制元件裡新增圖片

 

3.7 LabelControl控制元件

用法等同於Label控制元件

 

3.8 RadioGroup控制元件

其Columns屬性決定顯示的列數,

示例程式碼:

using DevExpress.XtraEditors.Controls;

///

///

object[] itemValues = new object[] {10, 11, 12, 13, 14};

string [] itemDescriptions = new string [] {"Circle", "Rectangle", "Ellipse", "Triangle", "Square"};

for(int i = 0; i < itemValues.Length; i++) {

    radioGroup1.Properties.Items.Add(new RadioGroupItem(itemValues[i], itemDescriptions[i]));

}

//Select the Rectangle item.

radioGroup1.EditValue = 11;

 

3.9MarqueeProgressBarControl

Text屬性顯示在運動時顯示的文字;

其Properties屬性下的MarqueeAnimationSpeed屬性控制其滾動速度

如圖所示:

 

marqueeProgressBarControl1.Properties.MarqueeAnimationSpeed = 100;

 marqueeProgressBarControl1.Text = "Loading...";

 

3.10 ProgressBarControl控制元件

進度條

示例程式碼:

using System.IO;

using DevExpress.XtraEditors.Controls;

// ...

private void DeleteFiles(string source){

   if (Directory.Exists(source)){

      string[] fileEntries = Directory.GetFiles(source);

      // Initializing progress bar properties

      progressBarControl1.Properties.Step = 1;

      progressBarControl1.Properties.PercentView = true;

      progressBarControl1.Properties.Maximum = fileEntries.Length;

      progressBarControl1.Properties.Minimum = 0;

      // Removing the list of files found in the specified directory

      foreach(string fileName in fileEntries){

         File.Delete(fileName);

         progressBarControl1.PerformStep();

      //進行再次重繪

         progressBarControl1.Update();

      }

   }

}

// ...

DeleteFiles("d:\\Temp");

 

 

3.11 ImageListBoxControl

ImageListBoxControl與ListBoxControl的區別是其列表框中的每一項都有顯示圖片的能力;

 

           imageListBoxControl1.Items.Add("One");

     imageListBoxControl1.Items.Add("Two");

    imageListBoxControl1.Items.Add("Third");

     imageListBoxControl1.Items[0].ImageIndex = 0;

 

            imageListBoxControl1.Items[1].ImageIndex = 0;

        imageListBoxControl1.Items[2}.ImageIndex = 0;

 

3.12 SpinEdit控制元件

 

   此按鈕控制元件是用來增加或減少在編輯的文字編輯區顯示的數值,該編輯值可以是一個整數或浮點數。

其Text屬性顯示編輯區的文字;

其Value屬性獲得編輯區的值;

示例程式碼:spinEdit1.Text =( spinEdit1.Value +1).ToString();

 

3.13 ProgressPanel控制元件

 

   該控制元件是用來表示任何操作的進度,該控制元件包含一個動畫影像和兩個標籤,其中兩個標籤分別用來指定標題和描述屬性;

如圖:

 

  ProgressPanel包含了許多影像,可以手動指定顯示的影像格式,通過LookAndFeel屬性來設定,示例程式碼:

DevExpress.XtraWaitForm.ProgressPanel progressPanel1=new DevExpress.XtraWaitForm.ProgressPanel();

            this.progressPanel1.LookAndFeel.SkinName = "DevExpress Dark Style";

            this.progressPanel1.LookAndFeel.Style=       DevExpress.LookAndFeel.LookAndFeelStyle.UltraFlat;

            this.progressPanel1.LookAndFeel.UseDefaultLookAndFeel = false;

 

 

3.14 SimpleButton控制元件

使用SimpleButton控制建立一個Button按鈕,可以通過其Image屬性新增圖片;該控制元件與WinForm自帶的Button按鈕類同;

 

3.15 CheckedListBoxControl控制元件

該控制元件以列表框的形式顯示覆選列表;

效果如圖:

 

示例程式碼:

using DevExpress.XtraEditors;

using DevExpress.XtraEditors.Controls;

// ...

CheckedListBoxItem[] items = {

                                 new CheckedListBoxItem("January", false),

                                 new CheckedListBoxItem("February", false),

                                 new CheckedListBoxItem("March", true),

                                 new CheckedListBoxItem("April", false),

                                 new CheckedListBoxItem("May", false),

                                 new CheckedListBoxItem("June", true),

                                 new CheckedListBoxItem("July", true),

                                 new CheckedListBoxItem("August", false),

                                 new CheckedListBoxItem("September", false),

                                 new CheckedListBoxItem("October", false),

                                 new CheckedListBoxItem("November", false),

                                 new CheckedListBoxItem("December", false)

                              };

private void CreateCheckedListBoxControl(CheckedListBoxItem[] items){

   CheckedListBoxControl checkedListBoxControl = new CheckedListBoxControl();

   Controls.Add(checkedListBoxControl);

   checkedListBoxControl.Left = 20;

   checkedListBoxControl.Top = 20;

   checkedListBoxControl.Width = 200;

   checkedListBoxControl.Height = 150;

   checkedListBoxControl.Items.AddRange(items);

}

// ...

CreateCheckedListBoxControl(items);

 

 

4、Rich Text Editor

1、RichEditControl控制元件

 該控制元件可以生成類似Word文件的文字編輯器,可以通過CreateBarManger方法自動生成相應的選單項;

5、Scheduling

5.1 SchedulerControl

   該控制元件以視覺化的效果顯示預約或者設定的行程;該控制元件預約後的資料儲存在SchedulerStorage物件裡,當以拖動形式新增SchedulerControl控制元件時,系統會自動分配一個SchedulerStorage物件。

 5.2、DateNavigator控制元件

該控制元件是一個可以快速在SchedulerControl控制元件中進行日期排程的控制元件,利用其schedulercontrol屬性與SchedulerControl控制元件進行繫結;

示例程式碼:

 // Hide the Today button.

   dateNavigator1.ShowTodayButton = false;

 

   // Assign the existing Scheduler Control to this Date Navigator.

   dateNavigator1.SchedulerControl = schedulerControl1;

圖片演示:

 

 

6、Spreadsheet

1、SpreadsheetControl控制元件

該控制元件生成Excel表格,可以通過CreateBarManger方法自動生成相應的選單項;

2、SpreadSheetNameBoxControl控制元件

該控制元件可以結合SpreadSheetControl控制元件一起使用,可以顯示當前選中的是哪個單元格;

3、SpreadsheetFomulaBarControl控制元件

該控制元件結合SpreadSheetControl控制元件一起使用,可以顯示對幾個單元格中的值進行計算;