Drag and drop

Requires Platform 4.2+ (Java Client only)

Defining Custom Drag and Drop Styles

In Nexaweb 4.2.x, you can define custom styles for the appearance of drag and drop events in your applicaton's UI.

The custom styles that you create in your own stylesheets override the Nexaweb default stylesheet drag and drop style definitions. Nexaweb recommends that you define drag and drop styles in your own stylesheets rather than editing the drag and drop style definitions in the default stylesheet.

You customize the appearance of drag and drop events by creating styles for the following target elements:

Each style that you define in a stylesheet contains the following:

• A set of target elements to which the style applies, specified by the applyTo attribute 
• A set of states for which the style defines attributes. That is, Nexaweb applies the specified attributes when a target is in the given state.
• The attributes specified for each state

You can specify only normal state style attributes for the dragOutline and dropOutline target elements, as only the normal state applies to these target elements.

Nexaweb stylesheets are XML-based and use a .XSS extension. You can create and edit them using the Nexaweb Studio stylesheet editor or by editing the source directly in an XML editor. For more general information on creating styles, seeStylesheets in the Nexaweb Studio Guide.

Creating a Style for dragOutline

For the dragOutline target element, you can specify any style related attribute (fonts, colors, borders, and so forth) available for the normal state.

In addition, you can specify a dragMode attribute with any of the following values: 

 To add a custom style for dragOutline, follow these steps:

1. Open the stylesheet to which you want to add these styles, or start a new stylesheet.
   Note: Nexaweb does not recommend that you edit the default stylesheet.
    
2. Create a dragOutline style similar to the following:

   <style applyTo="dragOutline">
    <normal borderWidth="2" borderStyle="solid" borderColor="green"
            bgColor="transparent" dragMode="transparent"/>
   </style>

3. Save and close the stylesheet.

Creating a Style for dropOutline

For the dropOutline target element, you can specify any style related attribute (fonts, colors, borders, and so forth) available for the normal state.

 To add a custom style for dropOutline, follow these steps:

1. Open the stylesheet to which you want to add these styles, or start a new stylesheet.
   Note: Nexaweb does not recommend that you edit the default stylesheet.
    
2. Create a dropOutline style similar to the following:

   <style applyTo="dropOutline">
    <normal borderWidth="2" borderStyle="solid" borderColor="red" 
            bgColor="transparent"/>
   </style> 

3. Save and close the stylesheet.