1. Create a dictionary of index-file names and populate this dictionary in the ASPxImageGallery.ItemDataBound event handler.

[C#]
Dictionary<int,string>imageIndicies=newDictionary<int,string>();protectedvoidASPxImageGallery1_ItemDataBound(objectsource,ImageGalleryItemEventArgse){e.Item.Text="Text "+e.Item.Index;imageIndicies.Add(e.Item.Index,GetName(e.Item.ImageUrl));} 

2. Pass the dictionary to the client side in the ASPxImageGallery.DataBound event handler, use ASPxImageGallery.JSProperties for this.

[C#]
protectedvoidASPxImageGallery1_DataBound(objectsender,EventArgse){vargallery=senderasASPxImageGallery;gallery.JSProperties["cp_items"]=imageIndicies;} 

Your property name should start with the cp prefix. You will be able to address this property on the client side via the ASPxImageGallery ClientInstanceName.

3. Assign a custom style to every gallery item using the Styles property. This is necessary to find a gallery item node further.

[ASPx]
<Styles><ItemCssClass="galleryItem"></Item></Styles>

4. Implement ASPxImageGallery.ItemTextTemplate. In this template, create a div element that will be responsible for marking an image as ready for deletion.

[ASPx]
<ItemTextTemplate><divclass="alignLeft"><%# Container.Item.Text %></div><divclass="alignRight deleteButton"id="div<%#Container.Item.Index %>"onclick="setDeletedItem(<%# Container.Item.Index %>,this)"></div></ItemTextTemplate>

5. Handle the div onclick event. In this event handler, find the gallery item root node (by searching for the galleryItem class up the tree), place a new transparent red div over the gallery item to show a user that the item state has been changed and add a file name to a new collection of images' names ready for deletion. In the sample, ASPxHiddenField is used to save images' names that are ready for deletion.

[JavaScript]
function setDeletedItem(index, el){var itemContainer = findAncestor(el, "galleryItem");if(!itemContainer)return;
    addOrDeleteImageInDictionary(index);
    addDeletedOverlay(itemContainer, index);} 

6. Place the Delete button on the Page and handle its client Click event. In this event, call the ASPxClientImageGallery.PerfromCallback method. On the server, handle the ASPxImageGallery.CustomCallback event and remove appropriate files both from ImageCacheFolder and ImageSourceFolder. To update ASPxImageGallery, call the UpdateImageCacheFolder method:

[C#]
protectedvoidASPxImageGallery1_CustomCallback(objectsender,CallbackEventArgsBasee){imageIndicies.Clear();stringfileName;foreach(variteminASPxHiddenField1){stringcacheFolderPath=Server.MapPath(ASPxImageGallery1.SettingsFolder.ImageCacheFolder);string[]cachedImages=Directory.GetFiles(cacheFolderPath,"*"+item.Key+"*",SearchOption.AllDirectories);for(inti= 0;i<cachedImages.Length;i++){File.Delete(cachedImages[i]);}fileName=Server.MapPath(Path.Combine(ASPxImageGallery1.SettingsFolder.ImageSourceFolder,item.Key));if(File.Exists(fileName)){File.Delete(fileName);}}ASPxImageGallery1.UpdateImageCacheFolder();}

By default, each bubble weight is calculated in relation to other points shown in the same series:
      "Aaa": {4, 1, 5}
      "Bbb": {6, 9, 5}
      "Ccc": {4, 6, 5}

If you wish to represent each bubble size in relation to all other bubbles from all series you will need to update the entire series weight accordingly. This example demonstrates how to update BubbleSeries.View.MinSize and BubbleSeries.View.MaxSize properties of all bubble series according to the min and max values of all series using the BoundDataChanged Event.

[C#]
privatevoidchartControl1_BoundDataChanged(objectsender,EventArgse){...foreach(varsiininfos){si.View.MaxSize=maxSize;si.View.MinSize=minSize;si.View.MaxSize=maxSize-sizeDelta*(maxValue-si.Max)/valueDelta;si.View.MinSize=minSize+sizeDelta*(si.Min-minValue)/valueDelta;si.View.AutoSize=false;//new line}}}

IMPORTANT NOTE

This article describes some advanced customization techniques and low-level entities of the framework with regard to data access, which may be required in complex scenarios only.
So, if you just want to change the connection string, e.g. to use the Oracle instead of the Microsoft SQL Server database, then you would better refer to the Connect an XAF Application to a Database Provider article and documentation on your database provider instead. The XAF integration of supported ORM libraries is also described in the Business Model Design section of the framework's documentation.

Introducing IObjectSpaceProvider and IObjectSpace
XAF accesses data from a data store through special abstractions called - IObjectSpaceProvider and IObjectSpace.
The IObjectSpace is an abstraction above the ORM-specific database context (e.g., the DBContext used in Entity Framework or the Session in XPO) allowing you to query or modify data.
The IObjectSpaceProvider is a provider/creator of IObjectSpace entities, which also manages which business types these IObjectSpace are supposed to work with, how to set up the underlying connection to the database, create and update it and other low level data access options.



An XafApplication can use one or several IObjectSpaceProvider objects at the same time, and you can access this information through the XafApplication.ObjectSpaceProvder or XafApplication.ObjectSpaceProviders properties. Check out these help links to learn more on how to plug in custom IObjectSpaceProvider objects a well.

There are several built-in implementations of the IObjectSpaceProvider and IObjectSpace interfaces in our framework, which are usually specific to a target ORM (Entity Framework or XPO). I suggest you check out the source code of the default framework classes to better understand the role of the IObjectSpaceProvider:

...\DevExpress.ExpressApp.Xpo\XPObjectSpaceProvider.cs
...\DevExpress.ExpressApp.EF\EFObjectSpaceProvider.cs 

Typical customization considerations
You may want to provide a fully custom IObjectSpaceProvider implementation or inherit from the built-in implementors when you want to customize how data access is performed for a chosen ORM.
Below is a list of typical scenarios where a custom IObjectSpaceProvider may be required:

1. How to use XPO caching in XAF 
2. How to prevent altering the legacy database schema when creating an XAF application 
3. How to connect to remote data store and configure WCF end point programmatically 
4. How do I change the default schema in the database
5. How to use a custom ObjectSpace throughout the application by handling the CreateCustomObjectSpaceProvider event? 
6. How to connect different ORM data models to several databases within a single application

In most cases, it is not required to implement the IObjectSpaceProvider interface from scratch since you can inherit from existing implementors or customize/just their parts.


XPO-specific customizations

1. Implementing IXpoDataStoreProvider
For instance, in XPO one of such replaceable parts is the IXpoDataStoreProvider interface, which enables you to provide a custom or configured IDataStore object, which is used for underlying data access with this ORM:

[C#]
publicinterfaceIXpoDataStoreProvider{IDataStoreCreateWorkingStore(outIDisposable[]disposableObjects);IDataStoreCreateUpdatingStore(outIDisposable[]disposableObjects);stringConnectionString{get;}}

In its turn, XAF provides several ready to use implementations of this interface for most popular scenarios: 

1. ConnectionDataStoreProvider - can provide IDataStore by the IDbConnection object;

2. ConnectionStringDataStoreProvider - can provide IDataStore by just connecting string information;

3. MemoryDataStoreProvider - DataSet based in-memory IDataStore providers.

Technically, such an IXpoDataStoreProvider part is passed into the XPObjectSpaceProvider constructor as a parameter, which means that you can just customize it instead of re-implementing the whole XPObjectSpaceProvider logic:

Consider the following example that shows how to access the underlying XPO connection provider for modifying its default command timeout:

[C#]
//In your XafApplication descendant class (e.g., in the YourSolutionName.Win/WinApplication.cs file).usingDevExpress.ExpressApp.Xpo;usingDevExpress.Xpo.DB;usingSystem.Data;...protectedoverridevoidCreateDefaultObjectSpaceProvider(CreateCustomObjectSpaceProviderEventArgsargs){args.ObjectSpaceProvider=newXPObjectSpaceProvider(newMyIXpoDataStoreProvider(args.ConnectionString,args.Connection,false),true);args.ObjectSpaceProviders.Add(newNonPersistentObjectSpaceProvider(TypesInfo,null));}publicclassMyIXpoDataStoreProvider:IXpoDataStoreProvider{privateIXpoDataStoreProviderinnerDataStoreProvider=null;publicMyIXpoDataStoreProvider(stringconnectionString,IDbConnectionconnection,boolenablePoolingInConnectionString){innerDataStoreProvider=XPObjectSpaceProvider.GetDataStoreProvider(connectionString,connection,enablePoolingInConnectionString);}publicstringConnectionString{get{returnthis.innerDataStoreProvider.ConnectionString;}}publicIDataStoreCreateSchemaCheckingStore(outIDisposable[]disposableObjects){returninnerDataStoreProvider.CreateSchemaCheckingStore(outdisposableObjects);}publicIDataStoreCreateUpdatingStore(boolallowUpdateSchema,outIDisposable[]disposableObjects){returninnerDataStoreProvider.CreateUpdatingStore(allowUpdateSchema,outdisposableObjects);}publicIDataStoreCreateWorkingStore(outIDisposable[]disposableObjects){IDataStoreds=innerDataStoreProvider.CreateWorkingStore(outdisposableObjects);ConnectionProviderSqlconnectionProvider=dsasConnectionProviderSql;if(connectionProvider!=null){// Can be null if connection pooling (DataStorePool) is used.connectionProvider.DefaultCommandTimeout= 100;}returnds;}}...

Refer to the ...\DevExpress.ExpressApp.Xpo\XPObjectSpaceProvider.cs file within the XAF source code to better understand the role of this part.

2. Overriding XPO connection or database providers

To learn more on this approach, check out the Database Systems Supported by XPO help topic and How to create a custom XPO connection provider and then use it in an XAF application article in particular.  To learn more on customizing data access settings for XPO, please refer to the corresponding product documentation: Data Access Layer.

See Also:
Can I connect an XAF application to a custom data source (Web service, OData service, NoSQL database, etc.)?

[ASPx]
<ExpandBarTemplate>
    <divid="container"class="collapsedMenu">
        <dx:ASPxMenuID="ASPxMenu2"ClientInstanceName="menu"runat="server"Width="100%"BackColor="Transparent"Orientation="Vertical">
            <Items>
                <dx:MenuItemName="item1"Text=" ">
                    <ImageIconID="actions_addfile_32x32">
                    </Image>
                </dx:MenuItem>
                <dx:MenuItemName="item2"Text=" ">
                    <ImageIconID="actions_apply_32x32">
                    </Image>
                </dx:MenuItem>
            </Items>
            <ItemStyleBackColor="Transparent"Border-BorderWidth="0px"Width="0px"></ItemStyle>
            <BorderBorderStyle="None"/>
        </dx:ASPxMenu>
    </div></ExpandBarTemplate>

[JavaScript]
function MenuItemsExpanded(s, e){
    menu.GetItemByName("item1").SetText("item1");
    menu.GetItemByName("item2").SetText("item2");
    container.classList.remove("collapsedMenu");
    container.classList.add("expandedMenu");
    html.style.paddingLeft = "89px";}function MenuItemsCollapsed(s, e){
    menu.GetItemByName("item1").SetText("");
    menu.GetItemByName("item2").SetText("");
    container.classList.remove("expandedMenu");
    container.classList.add("collapsedMenu");
    html.style.paddingLeft = "59px";}

[CSS]
.collapsedMenu{width:20px;}.expandedMenu{width:50px;}

[ASPx]
<ItemStyleBackColor="Transparent"Border-BorderWidth="0px"Width="0px"></ItemStyle>

[ASPx]
<ExpandedPanelCssClass="expandedPanel"></ExpandedPanel>

[CSS]
.expandedPanel{width:0px;}

[C#]
protectedvoidASPxGridView1_CustomJSProperties(objectsender,ASPxGridViewClientJSPropertiesEventArgse){vargrid=senderasASPxGridView;varkeySumPairs=newHashtable();vargroups=grid.GetGroupedColumns().OrderBy(g=>g.GroupIndex).Select(g=>g.FieldName).ToArray();for(inti=grid.VisibleStartIndex;i<grid.VisibleRowCount;i++){if(grid.IsGroupRow(i))continue;varkey=grid.GetRowValues(i,grid.KeyFieldName);vargroupValue=grid.GetRowValues(i,groups);keySumPairs.Add(key,groupValue);}e.Properties.Add("cp_keys",keySumPairs);e.Properties.Add("cp_groups",groups);}

[ASPx]
<dx:GridViewDataTextColumnFieldName="C"><GroupFooterTemplate><dx:ASPxLabelID="C_Sum"runat="server"EnableClientSideAPI="true"OnInit="C_Sum_Init"></dx:ASPxLabel></GroupFooterTemplate></dx:GridViewDataTextColumn>

[C#]
protectedvoidC_Sum_Init(objectsender,EventArgse){varlbl=senderasASPxLabel;varcontainer=lbl.NamingContainerasGridViewGroupFooterCellTemplateContainer;vargroupIndex=container.VisibleIndex;lbl.ClientInstanceName=GetName(container);lbl.Text=container.Text;lbl.JSProperties["cp_prefix"]="SUM=";lbl.JSProperties["cp_value"]=container.Grid.GetGroupSummaryValue(groupIndex,container.Grid.GroupSummary["C"]);}privatestringGetName(GridViewGroupFooterCellTemplateContainercontainer){vargroupedColumns=container.Grid.GetGroupedColumns().Where(g=>g.GroupIndex<=container.GroupedColumn.GroupIndex).OrderBy(g=>g.GroupIndex).Select(g=>g.FieldName).ToArray();vardata=container.Grid.GetRowValues(container.VisibleIndex,groupedColumns);vargroupValues=groupedColumns.Length== 1 ?newobject[]{data}:dataasobject[];varname="";for(inti= 0;i<groupedColumns.Length;i++){name+=groupedColumns[i]+groupValues[i];}returnname;}

4. On the client side, handle the BatchEditEndEditing event. This event is raised on every ASPxGridView value changing. Using information passed through the ASPxGridView.CustomJSProperties event, get group rows' values for a changed grid row by its key. This info and group columns' names will allow you to form a unique ASPxLabel name and call the ASPxClientLabel.SetText method to change the group summary value:

[JavaScript]
function OnEndEditing(s, e){var summaryField = "C";var key = s.GetRowKey(e.visibleIndex);var originalValue = s.batchEditApi.GetCellValue(e.visibleIndex, summaryField);var newValue = e.rowValues[(s.GetColumnByField(summaryField).index)].value;var dif = newValue - originalValue;var groupValues = s.cp_keys[key];var groups = s.cp_groups;
    updateSummaries(groupValues,groups, dif);}function updateSummaries(values, groups, dif){if(!values)return;var name = "";var length = values.length;for(var i = 0; i < length; i++){
        name += groups[i] + values[i];
        updateSummary(ASPxClientLabel.Cast(name),dif);}}function updateSummary(summary, dif){if(!summary)return;var newValue = summary.cp_value + dif;
    summary.cp_value = newValue;
    summary.SetText(summary.cp_prefix + newValue);}

See Also:

ASPxGridView - Batch Edit - How to calculate values on the fly 
ASPxGridView - Batch Edit - How to calculate unbound column and total summary values on the fly 

ASP.NET MVC Example:
GridView - How to update total summaries on the client side in Batch Edit mode

The sample illustrates how to drag and drop multiple nodes in ASPxTreeList when selection is enabled. To replace selected nodes from one parent node to another, it's sufficient to change the selected nodes' parent property at the DataSource level. This can be done by handling the ASPxClientTreeList.EndDragNode event and performing the ASPxClientTreeList custom callback. On the server-side, it's necessary to handle the ASPxTreeList.CustomCallback event and change the parent property in this event handler.

The most interesting part of this task is to show all selected nodes in a transparent popup when dragging. This can be achieved by handling the StartDragNode event. After the StartDragNode event is raised, a div container is created after the form element. It's possible to find this container, clone a table row inside the div container and assign selected node values to cloned rows. The div container is created after the StartDragNode event is handled, so it's necessary to implement your own custom function and call it asynchronously from the StartDragNode event handler.

This example is based on the How to: Configure Persistence with WorkflowServiceHost and How to: Enable SQL Persistence for Workflows and Workflow Services help articles from MSDN.

The only difference is that in code you can use the DevExpress.Workflow.Store.WorkflowInstanceStoreBehavior class (it is a part of the DevExpress.Workflow.Activities library) instead of the standard SqlWorkflowInstanceStoreBehavior one.

If you want to enable persistence for self-hosted workflows that use WorkflowApplication programmatically by using the SqlWorkflowInstanceStore class, you can use the built-in DevExpress.Workflow.Store.WorkflowInstanceStore one (it is also a part of the DevExpress.Workflow.Activities library):

[C#]
...usingDevExpress.Workflow.Xpo;usingDevExpress.ExpressApp.Xpo;usingDevExpress.Workflow.Store;...WorkflowInstanceStoredxWorkflowInstanceStore=newWorkflowInstanceStore(typeof(XpoWorkflowInstance),typeof(XpoInstanceKey),newXPObjectSpaceProvider(yourDatabaseConnectionString,null));

If you configure it via the configuration file, use the DevExpressWorkflowInstanceStore element instead of the standard sqlWorkflowInstanceStore one.

Refer to the XAF Workflow persistence storage blog post for more information.

See also:
How to create a correct connection string for XPO providers?
eXpressApp Framework > Concepts > Extra Modules > Workflow Module

Note: This example is obsolete. Please review the How to drag appointments from GridView and drop them onto the Scheduler Control using SchedulerDragData example instead.

Demonstrates how to drag data from a DataGridView control which is bound to the Cars data table of Cars.mdb demo database and drop it to the SchedulerControl.

See Also:
How to detect which element of the Scheduler was clicked
Drag-n-drop and iCal import - import of the iCal file being dropped on XtraScheduler
How to display a warning tooltip when dragging an appointment to forbidden area
How to drag and relocate the entire series of recurring appointments

This example shows how to use the SearchControl to locate required items displayed within a list box. To execute a search, enter a text within the Find box, and the list box linked to the Search Control will display those records that have matching values.

This example shows how to use the SearchControl to locate required items displayed within a list box. To execute a search, enter a text within the Find box, and the list box linked to the Search Control will display those records that have matching values.

The sample illustrates ways of assigning an image from the DevExpress Icon Collection. Images are presented in sprites. To load sprites properly, register ASPxHttpHandlerModule in the web.config.

1. A full list of DevExpress icons can be found by the following link: Icon Collection. You need to copy the Full Icon ID column value for the necessary icon and assign this value to the Image.IconID property: 

[ASPx]
<dx:ASPxButtonID="ASPxButton1"CssClass="button"runat="server"><ImageIconID="navigation_home_32x32"></Image></dx:ASPxButton>

2. Icon Collection constants can be used to assign the IconID at runtime:

[C#]
protectedoverridevoidOnInit(EventArgse){base.OnInit(e);ASPxButtonbutton4=newASPxButton();button4.ID="RuntimeButton";ph.Controls.Add(button4);button4.CssClass="button";button4.Image.IconID=DevExpress.Web.ASPxThemes.IconID.NavigationHome32x32;LiteralControllc=newLiteralControl("<span>This ASPxButton is created at runtime in PlaceHolder</span>");ph.Controls.Add(lc);}

3. It's possible to use DevExpress icons for non-DevExpress controls. Form the css class name by joining "dxIcon_" and the Full Icon ID column value. To use IconID constants for server controls, add a new css class to the CssClass property in the Init event handler:

[ASPx]
<asp:ButtonID="Button2"runat="server"CssClass="myButton"OnInit="Button2_Init"/>

[C#]
protectedvoidButton2_Init(objectsender,EventArgse){Buttonbtn=senderasButton;btn.CssClass+=" dxIcon_"+IconID.NavigationHome32x32;}

 4. For a standard input element, use an embedded code block to use IconID constants:

[ASPx]
<inputtype="button"class="dxIcon_<%= IconID.NavigationHome32x32%> myButton"/>

This example describes how to implement the KeyboardSelectedItemChanged event.

To implement this feature, we created a custom GalleryControl with a custom Gallery and added the KeyboardSelectedItemChanged event to the control.

In a GalleryControlGallery descendant we implemented a public MyViewInfo property in order to grant the user access to protected ViewInfo.

In a GalleryControl descendant, we implemented the KeyboardSelectedItemChanged event, and overrode the CreateGallery and OnKeyDown methods.

The CreateGallery method now returns a gallery of the MyGalleryControlGallery type.

In the OnKeyDown method, after the base method has been called, KeyboardSelectionEventArgs are created and the KeyboardSelectedItemChanged event is raised

The KeyboardSelectionEventArgs class contains itemViewInfo, itemIndex, GroupViewInfo, GroupIndex.

[VB.NET]
PrivateSub myGalleryControl1_KeyboardSelectedItemChanged(ByVal sender AsObject, ByVal e As EventArgs)EndSub

[VB.NET]
PrivateSub myGalleryControl1_KeyboardSelectedItemChanged(ByVal sender AsObject, ByVal e As KeyboardSelectionEventArgs)EndSub

This example demonstrates how to register and use SVG shapes in DiagramControl/DiagramDesignerControl. The ShapeDescription.CreateSvgShape method creates a shape from a stream that contains an SVG image.

Icons used in the sample project: IcoMoon's "Free Shapes" pack.