270 lines
10 KiB
HTML
270 lines
10 KiB
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||
<head>
|
||
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
|
||
<title>Item Reordering</title>
|
||
<link href="style.css" rel="stylesheet" type="text/css">
|
||
<link href="prettify.css" type="text/css" rel="stylesheet">
|
||
<script type="text/javascript" src="prettify.js"></script><script type="text/javascript" src="lang-vb.js"></script><link href="../resources/main.css" media="screen" rel="stylesheet" type="text/css">
|
||
</head>
|
||
<body onload="prettyPrint()"><div class="placing">
|
||
<br><table class="navigation"><tr>
|
||
<td class="navigation-previous"><a href="chapter-insertion-mark.html"><strong>
|
||
« Insertion Mark</strong></a></td>
|
||
<td class="navigation-index"><a href="../../../better-thumbnail-browser/documentation.html"><strong>Index</strong></a></td>
|
||
<td class="navigation-next"><a href="chapter-items.html"><strong>Items »
|
||
</strong></a></td>
|
||
</tr></table>
|
||
<br><h1>Item Reordering</h1>
|
||
<div class="banner">
|
||
<a href="../../../better-thumbnail-browser.html"><img src="../resources/better-thumbnail-browser-overview.gif" alt="Better Thumbnail Browser" class="ss"></a>
|
||
<div class="inside">
|
||
<div class="text">Better Thumbnail Browser for .NET (C#, VB) - Image thumbnail viewing and loading control</div>
|
||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterthumbnailbrowser.exe" class="dbtn">Download</a></span></span>
|
||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../better-thumbnail-browser.html" class="dbtn">More Info</a></span></span>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<p class="images"><img src="item-reorder.png"></p>
|
||
|
||
<p>Changing item order by dragging items can be turned on by setting
|
||
<span class="code">ItemReorderMode</span> to one of the following values:</p>
|
||
|
||
<ul style="list-style:none">
|
||
<li>
|
||
<span class="code">Disabled</span><ul style="list-style:none"><li>
|
||
<p>Item reordering is disabled (default value).</p>
|
||
</li></ul>
|
||
</li>
|
||
<li>
|
||
<span class="code">Enabled</span><ul style="list-style:none"><li>
|
||
<p>Item reordering is enabled and automatic.</p>
|
||
</li></ul>
|
||
</li>
|
||
<li>
|
||
<span class="code">Custom</span><ul style="list-style:none"><li>
|
||
<p>Item reordering is enabled, but the actual reordering is up to
|
||
the user.</p>
|
||
</li></ul>
|
||
</li>
|
||
</ul>
|
||
<p>The reordering is realized through Drag and Drop mechanism.</p>
|
||
|
||
<p>Item reordering can supports groups and item hierarchy.</p>
|
||
|
||
<p>Target location of reordered items is displayed using <strong><em><a href="chapter-insertion-mark.html">Insertion mark</a></em></strong>. If the
|
||
reordering cannot be performed (e.g. when inserting item between its own
|
||
children), then the insertion mark is displayed as disabled and the
|
||
reordering will not be performed.</p>
|
||
|
||
<h2>Reordering Options</h2>
|
||
|
||
|
||
<p>There are several item reordering options to adjust the feature for
|
||
working with groups and hierarchical items. These options can be used as
|
||
flags of the enumm property <span class="code">ItemReorderOptions</span>:</p>
|
||
|
||
<ul style="list-style:none">
|
||
<li>
|
||
<span class="code">AllowCreateChild</span><ul style="list-style:none"><li>
|
||
<p>Allow creating a child items by inserting item into another
|
||
item without children.</p>
|
||
</li></ul>
|
||
</li>
|
||
<li>
|
||
<span class="code">AutoCollapse</span><ul style="list-style:none"><li>
|
||
<p>Collapse item with children prior to reordering.</p>
|
||
</li></ul>
|
||
</li>
|
||
<li>
|
||
<span class="code">KeepGroups</span><ul style="list-style:none"><li>
|
||
<p>Do not change item groups when reordering.</p>
|
||
</li></ul>
|
||
</li>
|
||
<li>
|
||
<span class="code">KeepItemHierarchy</span><ul style="list-style:none"><li>
|
||
<p>Keep parent-child item relations when reordering.</p>
|
||
</li></ul>
|
||
</li>
|
||
<li>
|
||
<span class="code">None</span><ul style="list-style:none"><li>
|
||
<p>No options are active.</p>
|
||
</li></ul>
|
||
</li>
|
||
<li>
|
||
<span class="code">SameParentOnly</span><ul style="list-style:none"><li>
|
||
<p>Allow reordering items with same parent item only.</p>
|
||
</li></ul>
|
||
</li>
|
||
</ul>
|
||
<p>None of the extra options are on by default so the default value is
|
||
<span class="code">ItemReorderOptions.None</span>.</p>
|
||
|
||
|
||
<h2>Auto-Expansion Checking</h2>
|
||
|
||
|
||
<p>Auto expansion checking is performed during item reordering and
|
||
looks whether it is valid to auto expand item over which mouse cursor
|
||
hovers. By default, there is only one situation when auto expansion is not
|
||
allowed: Item which is auto-collapsed will not be than auto-expanded
|
||
again.</p>
|
||
|
||
<p>It is possible to add custom checking (e.g. when some items or
|
||
groups should not expand when user drags items over it) by handling
|
||
<span class="code">CheckAutoExpand</span> event and than set
|
||
<span class="code">BetterListViewCheckAutoExpandEventArgs.IsValid</span> to
|
||
<span class="code">false</span> whenever you want to deny auto-expansion. Event data
|
||
contains both source and target items.</p>
|
||
|
||
|
||
<h2>Item Reordering Checking</h2>
|
||
|
||
|
||
<p>Checking for item reorder validity is performed during item
|
||
reordering. It looks for possible reasons why the reordering may not be
|
||
valid (e.g. reordering parent item into itself) and sets
|
||
<span class="code">BetterListViewItemReorderEventArgs.InvalidationReasons</span>
|
||
property. The property can have the following flags:</p>
|
||
|
||
<ul style="list-style:none">
|
||
<li>None<ul style="list-style:none"><li>
|
||
<p>Item reorder is valid.</p>
|
||
</li></ul>
|
||
</li>
|
||
<li>NotTopLevel<ul style="list-style:none"><li>
|
||
<p>Item reorder is invalid in case of data binding when other
|
||
than top-level item is being reordered.</p>
|
||
</li></ul>
|
||
</li>
|
||
<li>NotSameParent<ul style="list-style:none"><li>
|
||
<p>Item is being reordered under different parent when
|
||
SameParentOnly item reordering option is turned on.</p>
|
||
</li></ul>
|
||
</li>
|
||
<li>PutInItself<ul style="list-style:none"><li>
|
||
<p>Item is being reordered under itself.</p>
|
||
</li></ul>
|
||
</li>
|
||
<li>AnotherGroup<ul style="list-style:none"><li>
|
||
<p>Item is being reordered in differenet group while changing
|
||
groups is not allowed.</p>
|
||
</li></ul>
|
||
</li>
|
||
<li>Custom<ul style="list-style:none"><li>
|
||
<p>User-specified reason for invalid item reorder.</p>
|
||
</li></ul>
|
||
</li>
|
||
</ul>
|
||
<p>You can override the <span class="code">OnCheckItemReorder</span> method or add
|
||
<span class="code">CheckItemReorder</span> event handler to add your own
|
||
validation.</p>
|
||
|
||
<p>Event data contains read-only property called <span class="code">IsValid</span>,
|
||
which is true whenever <span class="code">InvalidationReasons</span> property is equal
|
||
to <span class="code">BetterListViewInvalidationReasons.None</span>.</p>
|
||
|
||
<p>Item reorder validity influences appearance of insertion mark (will
|
||
be displayed in disabled state) and whether the reordering will be
|
||
performed.</p>
|
||
|
||
|
||
<h2>Item Reordering Info</h2>
|
||
|
||
|
||
<p>When user releases mouse button, the <span class="code">ItemReorder</span> event
|
||
is raised. You can find useful properties in the event data:</p>
|
||
|
||
<ul style="list-style:none">
|
||
<li>Locations<ul style="list-style:none"><li>
|
||
<p>Item locations before and after reordering structured as
|
||
key-value pairs within dictionary.</p>
|
||
</li></ul>
|
||
</li>
|
||
<li>SourceItems<ul style="list-style:none"><li>
|
||
<p>Items being reordered.</p>
|
||
</li></ul>
|
||
</li>
|
||
<li>TargetAddress<ul style="list-style:none"><li>
|
||
<p>Target item address before reordering.</p>
|
||
</li></ul>
|
||
</li>
|
||
<li>TargetAddressAdjusted<ul style="list-style:none"><li>
|
||
<p>Target item address after reordering. When doing custom
|
||
reordering, this <strong><em>adjusted</em></strong> address is relevant
|
||
when source items are removed from the list.</p>
|
||
</li></ul>
|
||
</li>
|
||
</ul>
|
||
<h2>Sample Source Code</h2>
|
||
|
||
|
||
<p><strong>C#</strong></p>
|
||
<pre class="prettyprint"><code class="lang-cs">this.listView.BeginUpdate();
|
||
|
||
this.listView.Columns.Add("column");
|
||
|
||
this.listView.Items.AddRange(
|
||
new[]
|
||
{
|
||
"first item",
|
||
"second item",
|
||
"third item",
|
||
"fourth item",
|
||
"fifth item"
|
||
});
|
||
|
||
// enable item reordering
|
||
this.listView.ItemReorderMode = BetterListViewItemReorderMode.Enabled;
|
||
|
||
this.listView.EndUpdate();</code></pre>
|
||
|
||
<p><strong>Visual Basic</strong></p>
|
||
<pre class="prettyprint"><code class="lang-vb">ListView.BeginUpdate()
|
||
|
||
ListView.Columns.Add ("column")
|
||
|
||
ListView.Items.AddRange (
|
||
New String() { _
|
||
"first item",
|
||
"second item",
|
||
"third item",
|
||
"fourth item",
|
||
"fifth item"
|
||
})
|
||
|
||
' enable item reordering
|
||
ListView.ItemReorderMode = BetterListViewItemReorderMode.Enabled
|
||
|
||
ListView.EndUpdate()</code></pre>
|
||
|
||
<br><div class="banner">
|
||
<a href="../../../better-thumbnail-browser.html"><img src="../resources/better-thumbnail-browser-overview.gif" alt="Better Thumbnail Browser" class="ss"></a>
|
||
<div class="inside">
|
||
<div class="text">Better Thumbnail Browser for .NET (C#, VB) - Image thumbnail viewing and loading control</div>
|
||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterthumbnailbrowser.exe" class="dbtn">Download</a></span></span>
|
||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../better-thumbnail-browser.html" class="dbtn">More Info</a></span></span>
|
||
</div>
|
||
</div>
|
||
<table class="navigation"><tr>
|
||
<td class="navigation-previous"><a href="chapter-insertion-mark.html"><strong>
|
||
« Insertion Mark</strong></a></td>
|
||
<td class="navigation-index"><a href="../../../better-thumbnail-browser/documentation.html"><strong>Index</strong></a></td>
|
||
<td class="navigation-next"><a href="chapter-items.html"><strong>Items »
|
||
</strong></a></td>
|
||
</tr></table>
|
||
<br><table class="footer"><tr>
|
||
<td class="footer-title">Better Thumbnail Browser Documentation
|
||
</td>
|
||
<td class="footer-copyright">
|
||
Copyright © 2010-2012 <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||
</td>
|
||
</tr></table>
|
||
</div></body>
|
||
</html>
|