Add documentation, class reference, and quick-start guide pages (5771 files)
This commit is contained in:
Jarvis Prime
Binary file not shown.
|
After Width: | Height: | Size: 22 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 22 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 38 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 45 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 28 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 54 KiB |
@@ -0,0 +1,121 @@
|
||||
<!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>Background Image</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="../../../better-listview-express/quick-start-guide.html"><strong>
|
||||
« Quick Start</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-checkboxes.html"><strong>Check Boxes »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Background Image</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<p>There are four properties to control background image:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">BackgroundImage</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BackgroundImageAlignment</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BackgroundImageLayout</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BackgroundImageOpacity</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>The <span class="code">BackgroundImage</span> property is actually derived from
|
||||
<span class="code">System.Windows.Forms.Control</span> class.</p>
|
||||
|
||||
<p>This property is hidden in the regular .NET ListView.</p>
|
||||
|
||||
<p>Setting <span class="code">BackgroundImageLayout</span> to <span class="code">None</span> and
|
||||
changing the <span class="code">BackgroundImageAlignment</span> property yields different
|
||||
positioning of background image:</p>
|
||||
|
||||
<p class="images"><img src="background-image-align1.png"><img src="background-image-align2.png"></p>
|
||||
|
||||
<p>The image can also be tiled, scaled proportionally or unproportionally
|
||||
by changing the <span class="code">BackgroundImageLayout</span> property:</p>
|
||||
|
||||
<p class="images"><img src="background-image-layout1.png"><img src="background-image-layout2.png"></p>
|
||||
|
||||
<p>Image opacity can also be changed via the
|
||||
<span class="code">BackgroundImageOpacity</span> property:</p>
|
||||
|
||||
<p class="images"><img src="background-image-opacity1.png"><img src="background-image-opacity2.png"></p>
|
||||
|
||||
<h2>Sample Source Code</h2>
|
||||
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">this.listView.BeginUpdate();
|
||||
|
||||
// set background image
|
||||
this.listView.BackgroundImage = Resources.ImageOwl;
|
||||
|
||||
// set background image properties
|
||||
this.listView.BackgroundImageAlignment = ContentAlignment.BottomRight;
|
||||
this.listView.BackgroundImageLayout = ImageLayout.None;
|
||||
this.listView.BackgroundImageOpacity = 64;
|
||||
|
||||
this.listView.EndUpdate();</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">ListView.BeginUpdate()
|
||||
|
||||
' set background image
|
||||
ListView.BackgroundImage = Resources.ImageOwl
|
||||
|
||||
' set background image properties
|
||||
ListView.BackgroundImageAlignment = ContentAlignment.BottomRight
|
||||
ListView.BackgroundImageLayout = ImageLayout.None
|
||||
ListView.BackgroundImageOpacity = 64
|
||||
|
||||
ListView.EndUpdate()</code></pre>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="../../../better-listview-express/quick-start-guide.html"><strong>
|
||||
« Quick Start</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-checkboxes.html"><strong>Check Boxes »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,133 @@
|
||||
<!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>Check Boxes</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-background-image.html"><strong>
|
||||
« Background Image</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-collections.html"><strong>Collections »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Check Boxes</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<br><hr>
|
||||
<p class="note">Only two-state check boxes are available in <strong><em>Better
|
||||
ListView Express</em></strong>.</p>
|
||||
<hr>
|
||||
<br><p>To set up check boxes, set <span class="code">CheckBoxes</span> property to either
|
||||
<span class="code">TwoState</span> or <span class="code">ThreeState</span>. You can disable check box
|
||||
on certain items by setting
|
||||
<span class="code">BetterListViewItem.AllowShowCheckBox</span> property to
|
||||
<span class="code"></span></p>
|
||||
|
||||
<p><span class="code">false</span>. The following image shows three state check boxes
|
||||
with the last items with check box disabled:</p>
|
||||
|
||||
<p class="images"><img src="checkboxes-overview.png"></p>
|
||||
|
||||
<p>Check boxes are supported in every view. For example, here are the
|
||||
check boxes enabled in <span class="code">Thumbnails</span> view:</p>
|
||||
|
||||
<p class="images"><img src="checkboxes-thumbnails.png"></p>
|
||||
|
||||
<h2>Sample Source Code</h2>
|
||||
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">this.listView.BeginUpdate();
|
||||
|
||||
this.listView.Items.AddRange(
|
||||
new[]
|
||||
{
|
||||
"unchecked by default",
|
||||
"checked by default",
|
||||
"indeterminate by default",
|
||||
"check box disabled"
|
||||
});
|
||||
|
||||
// set the first item unchecked
|
||||
this.listView.Items[0].CheckState = CheckState.Unchecked;
|
||||
// set the second item checked
|
||||
this.listView.Items[1].CheckState = CheckState.Checked;
|
||||
// set the third item in indeterminate state
|
||||
this.listView.Items[2].CheckState = CheckState.Indeterminate;
|
||||
// disable check box on the fourth item
|
||||
this.listView.Items[3].AllowShowCheckBox = false;
|
||||
|
||||
// enable three-state check boxes (the same property can be used for disabling them or settings two-state ones)
|
||||
this.listView.CheckBoxes = BetterListViewCheckBoxes.ThreeState;
|
||||
// check boxes are supported in all views, so we can set for example the 'List' view
|
||||
this.listView.View = BetterListViewView.List;
|
||||
|
||||
this.listView.EndUpdate();</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">ListView.BeginUpdate()
|
||||
|
||||
ListView.Items.AddRange(
|
||||
New String() {
|
||||
"unchecked by default",
|
||||
"checked by default",
|
||||
"indeterminate by default",
|
||||
"check box disabled"
|
||||
})
|
||||
|
||||
' set the first item unchecked
|
||||
ListView.Items (0).CheckState = CheckState.Unchecked
|
||||
' set the second item checked
|
||||
ListView.Items (1).CheckState = CheckState.Checked
|
||||
' set the third item in indeterminate state
|
||||
ListView.Items (2).CheckState = CheckState.Indeterminate
|
||||
' disable check box on the fourth item
|
||||
ListView.Items (3).AllowShowCheckBox = False
|
||||
|
||||
' enable three-state check boxes (the same property can be used for disabling them or settings two-state ones)
|
||||
ListView.CheckBoxes = BetterListViewCheckBoxes.ThreeState
|
||||
' check boxes are supported in all views, so we can set for example the 'List' view
|
||||
ListView.View = BetterListViewView.List
|
||||
|
||||
ListView.EndUpdate()</code></pre>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-background-image.html"><strong>
|
||||
« Background Image</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-collections.html"><strong>Collections »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,160 @@
|
||||
<!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>Collections</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-checkboxes.html"><strong>
|
||||
« Check Boxes</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-columns.html"><strong>Columns »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Collections</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<p>Better ListView contains several types collections of its elements
|
||||
(columns, items, sub-items, groups). These can be accessed via
|
||||
properties:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">Columns</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">Items</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">Groups</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewItem.SubItems</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewItem.ChildItems</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<br><hr>
|
||||
<p class="note"><strong><em>Better ListView Express</em></strong> does not contain the
|
||||
<span class="code">BetterListViewItem.ChildItems</span> collection as it does not
|
||||
support hierarchical items.</p>
|
||||
<hr>
|
||||
<br><p>Each of these collections are of type
|
||||
<span class="code">BetterListViewElementCollection<TItem></span> where
|
||||
<span class="code">TItem</span> is collection element type. All these collection also
|
||||
implement <span class="code">IList<TItem></span>,
|
||||
<span class="code">ICollection<TItem></span> and their nongeneric
|
||||
companions.</p>
|
||||
|
||||
<p>They also implement extra functionality through
|
||||
<span class="code">IExtendedList<TItem></span>:</p>
|
||||
|
||||
<ul style="list-style:none">
|
||||
<li>
|
||||
<span class="code">AddRange</span><ul style="list-style:none"><li>
|
||||
<p>add set of items</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">RemoveRange</span><ul style="list-style:none"><li>
|
||||
<p>remove subset of items</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
</ul>
|
||||
<p>These collections are bound to Better ListView, so any modification to
|
||||
these collection will be projected into control state.</p>
|
||||
|
||||
<p>When the collection is created by user code, e.g.:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">var myItems = new BetterListViewItemCollection();</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">Dim myItems = New BetterListViewItemCollection()</code></pre>
|
||||
|
||||
<p>then the collection is not bound to the control and its state is
|
||||
independent on the control's state.</p>
|
||||
|
||||
<p>All the collections are both binary and XML serializable.</p>
|
||||
|
||||
<h2>Adding Elements</h2>
|
||||
|
||||
|
||||
<p>Specific collections provide several overrides for easy addition of
|
||||
items, for example:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">myItems.Add("New Item");</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">myItems.Add("New Item")</code></pre>
|
||||
|
||||
<p>Adds new item with text 'New Item' in the collection.</p>
|
||||
|
||||
<p>All Better ListView collections support adding arbitrary objects,
|
||||
for example:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">var person = new Person("Mark Bradley", 13, Gender.Male);
|
||||
|
||||
myItems.Add(person);</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">Dim person = New Person("Mark Bradley", 13, Gender.Male)
|
||||
|
||||
myItems.Add(person)</code></pre>
|
||||
|
||||
<p>This will create a new BetterListViewItem with Text property
|
||||
obtained from converting the <span class="code">Person</span> object. The type can
|
||||
either provide custom <span class="code">TypeConverter</span>, or default
|
||||
<span class="code">TypeConverter</span> (for primive types) or <span class="code">ToString</span>
|
||||
method is used for conversion.</p>
|
||||
|
||||
<p>Multiple custom items can be added either:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">myItems.AddRange(new object[] { person1, person2, "New Person" });</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">myItems.AddRange(New Object() {person1, person2, "New Person"})</code></pre>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-checkboxes.html"><strong>
|
||||
« Check Boxes</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-columns.html"><strong>Columns »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,203 @@
|
||||
<!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>Columns</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-collections.html"><strong>
|
||||
« Collections</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-context-menus.html"><strong>Context Menus »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Columns</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<h2>Displaying/Hiding all Column Headers</h2>
|
||||
|
||||
|
||||
<p>To display column headers in other views than
|
||||
<strong><em>Details</em></strong>, set <span class="code">ColumnsDisplayMode</span> property
|
||||
to <span class="code">ShowAlways</span>. The default value is <span class="code">ShowDetails</span>
|
||||
(show column headers in <strong><em>Details</em></strong> view only). Setting
|
||||
the property to <span class="code">Hide</span> hides all column headers.</p>
|
||||
|
||||
<p>Following image shows column headers displayed in Tile view:</p>
|
||||
|
||||
<p class="images"><img src="column-all-views.png"></p>
|
||||
|
||||
<p>To hide specific columns only, see <strong><em><a href="chapter-columns.html#hide-custom">Hiding Custom Columns</a></em></strong> below.</p>
|
||||
|
||||
|
||||
<h2>Column Header Styles</h2>
|
||||
|
||||
|
||||
<p>Each column header can have one of three styles defined by
|
||||
<span class="code">BetterListViewColumnHeader.Style</span> property:</p>
|
||||
|
||||
<ul style="list-style:none">
|
||||
<li>
|
||||
<span class="code">BetterListViewColumnHeaderStyle.Clickable</span><ul style="list-style:none"><li>
|
||||
<p>Default value. The column gets highlighted when mouse cursor
|
||||
hovers over it and registers mouse clicks.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">BetterListViewColumnHeaderStyle.Nonclickable</span><ul style="list-style:none"><li>
|
||||
<p>The column does not react to mouse.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">BetterListViewColumnHeaderStyle.Sortable</span><ul style="list-style:none"><li>
|
||||
<p>The column is clickable and items get sorted according to this
|
||||
column. Small arrow appears on the column header when items are
|
||||
sorted.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
</ul>
|
||||
<h2>
|
||||
<a name="hide-custom" id="hide-custom"></a>Hiding Custom Columns</h2>
|
||||
|
||||
|
||||
<br><hr>
|
||||
<p class="note">Custom column hiding feature is not available in <strong><em>Better
|
||||
ListView Express</em></strong>.</p>
|
||||
<hr>
|
||||
<br><p>One way to hide a column would be simply removing it from
|
||||
<span class="code">Columns</span> collection. When there are items with sub-items,
|
||||
however, this approach requires removing also all the sub-items for the
|
||||
corresponding removed column.</p>
|
||||
|
||||
<p>When you need to just visually hide a column and corresponding
|
||||
sub-items (without removing them), call
|
||||
<span class="code">BetterListViewColumnHeader.Hide()</span> method. To re-show hidden
|
||||
column, call <span class="code">BetterListViewColumnHeader.Show()</span>. The same can
|
||||
be obtained by setting <span class="code">BetterListViewColumnHeader.Visible</span>
|
||||
property.</p>
|
||||
|
||||
<p>The following images show hiding some column in application which
|
||||
uses cotext menu for this action:</p>
|
||||
|
||||
<p class="images"><img src="column-hide-before.png"></p>
|
||||
|
||||
<p class="images"><img src="column-hide-after.png"></p>
|
||||
|
||||
|
||||
<h2>Column Resizing</h2>
|
||||
|
||||
|
||||
<p>Columns are resizable by default. There are two properties for
|
||||
setting-up this feature on each column:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewColumnHeader.MinimumWidth</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewColumnHeader.MaximumWidth</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>Values of these properties depend upon each other and the
|
||||
<span class="code">BetterListViewColumnHeader.Width</span> property. This is because
|
||||
the minimum width have to be always smaller than the maximum width and the
|
||||
column width have to lay between the two extremes.</p>
|
||||
|
||||
<p>To disable column resizing for a given column, set
|
||||
<span class="code">BetterListViewColumnHeader.AllowResize</span> to
|
||||
<span class="code">false</span>.</p>
|
||||
|
||||
<p>To detect column width adjustment, use the
|
||||
<span class="code">ColumnWidthChanging</span> and <span class="code">ColumnWidthChanged</span>
|
||||
events.</p>
|
||||
|
||||
<br><hr>
|
||||
<p class="note">Column header can have zero minimum width. In that case, it is
|
||||
possible to completely hide the column header. If several neighboring
|
||||
columns are collapsed this way, expanding them back is possible by
|
||||
dragging right side of a collapsed column header border.</p>
|
||||
<hr>
|
||||
<br><h2>Column Reordering</h2>
|
||||
|
||||
|
||||
<br><hr>
|
||||
<p class="note">This feature is not available in <strong><em>Better ListView
|
||||
Express</em></strong>.</p>
|
||||
<hr>
|
||||
<br><p class="images"><img src="column-reorder.png"></p>
|
||||
|
||||
<p>Column reordering is disabled by default, but se be set-up by simply
|
||||
settings <span class="code">ColumnReorderMode</span> property 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>Column reordering is disabled (default value).</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">Custom</span><ul style="list-style:none"><li>
|
||||
<p>Column reordering is enabled, but the actual reordering is
|
||||
governed from user code; only ColumnReordered event is
|
||||
raised.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">ColumnsOnly</span><ul style="list-style:none"><li>
|
||||
<p>Column reordering is done on columns-only, not
|
||||
sub-items.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">Enabled</span><ul style="list-style:none"><li>
|
||||
<p>Column reordering is enabled.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
</ul>
|
||||
<p><span class="code">ColumnReordered</span> event is raised after column reordering
|
||||
is finished. The actual reordering consists of switching column items in
|
||||
the <span class="code">Columns</span> collections and the corresponding sub-items in
|
||||
each row. This feature actually modifies data in the list, not only the
|
||||
visual part. If you need to do any other processing (e.g. switch item
|
||||
texts only), use custom reordering mode.</p>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-collections.html"><strong>
|
||||
« Collections</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-context-menus.html"><strong>Context Menus »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,185 @@
|
||||
<!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>Context Menus</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-columns.html"><strong>
|
||||
« Columns</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-data.html"><strong>Data Binding »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Context Menus</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<p class="images"><img src="context-menus.png"></p>
|
||||
|
||||
<p>Better ListView allows settings four distinct context menu via
|
||||
properties:</p>
|
||||
|
||||
<ul style="list-style:none">
|
||||
<li>
|
||||
<span class="code">ContextMenuStrip</span><ul style="list-style:none"><li>
|
||||
<p>Global context menu, used when uses clicks on client area (or on
|
||||
column header/item when the specific menu is not set).</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">ContextMenuStripColumns</span><ul style="list-style:none"><li>
|
||||
<p>Context menu for column headers.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">ContextMenuStripGroups</span><ul style="list-style:none"><li>
|
||||
<p>Context menu for groups.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">ContextMenuStripItems</span><ul style="list-style:none"><li>
|
||||
<p>Context menu for items.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
</ul>
|
||||
<br><hr>
|
||||
<p class="note">Only <span class="code">ContextMenuStrip</span> is available in <strong><em>Better
|
||||
ListView Express</em></strong>.</p>
|
||||
<hr>
|
||||
<br><p>These are of type
|
||||
<span class="code">System.Windows.Forms.ContextMenuStrip</span>.</p>
|
||||
|
||||
<p>Custom context menus can be displayed manually using
|
||||
<span class="code">MouseDown</span> event and <strong><em><a href="chapter-hit-test.html">HitTest</a></em></strong> method to detect location
|
||||
of the cursor.</p>
|
||||
|
||||
<h2>Sample Source Code</h2>
|
||||
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">// add column, group and item
|
||||
this.listView.BeginUpdate();
|
||||
|
||||
this.listView.Columns.Add(new BetterListViewColumnHeader("some column", 256));
|
||||
this.listView.Groups.Add("some group");
|
||||
this.listView.Items.Add(new BetterListViewItem("some item", this.listView.Groups[0]));
|
||||
|
||||
this.listView.ShowGroups = true;
|
||||
|
||||
this.listView.EndUpdate();
|
||||
|
||||
// set common context menu
|
||||
ContextMenuStrip contextMenuStripCommon = new ContextMenuStrip();
|
||||
|
||||
contextMenuStripCommon.Items.Add("Common Context Menu Item 1");
|
||||
contextMenuStripCommon.Items.Add("Common Context Menu Item 2");
|
||||
|
||||
this.listView.ContextMenuStrip = contextMenuStripCommon;
|
||||
|
||||
// set column header context menu
|
||||
ContextMenuStrip contextMenuStripColumnHeaders = new ContextMenuStrip();
|
||||
|
||||
contextMenuStripColumnHeaders.Items.Add("Column Header Context Menu Item 1");
|
||||
contextMenuStripColumnHeaders.Items.Add("Column Header Context Menu Item 2");
|
||||
|
||||
this.listView.ContextMenuStripColumns = contextMenuStripColumnHeaders;
|
||||
|
||||
// set item context menu
|
||||
ContextMenuStrip contextMenuStripItems = new ContextMenuStrip();
|
||||
|
||||
contextMenuStripItems.Items.Add("Item Context Menu Item 1");
|
||||
contextMenuStripItems.Items.Add("Item Context Menu Item 2");
|
||||
|
||||
this.listView.ContextMenuStripItems = contextMenuStripItems;
|
||||
|
||||
// set group context menu
|
||||
ContextMenuStrip contextMenuStripGroups = new ContextMenuStrip();
|
||||
|
||||
contextMenuStripGroups.Items.Add("Group Context Menu Item 1");
|
||||
contextMenuStripGroups.Items.Add("Group Context Menu Item 2");
|
||||
|
||||
this.listView.ContextMenuStripGroups = contextMenuStripGroups;</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">' add column, group and item
|
||||
ListView.BeginUpdate()
|
||||
|
||||
ListView.Columns.Add (New BetterListViewColumnHeader ("some column", 256))
|
||||
ListView.Groups.Add ("some group")
|
||||
ListView.Items.Add (New BetterListViewItem ("some item", ListView.Groups (0)))
|
||||
|
||||
ListView.ShowGroups = True
|
||||
|
||||
ListView.EndUpdate()
|
||||
|
||||
' set common context menu
|
||||
Dim contextMenuStripCommon As New ContextMenuStrip()
|
||||
|
||||
contextMenuStripCommon.Items.Add ("Common Context Menu Item 1")
|
||||
contextMenuStripCommon.Items.Add ("Common Context Menu Item 2")
|
||||
|
||||
ListView.ContextMenuStrip = contextMenuStripCommon
|
||||
|
||||
' set column header context menu
|
||||
Dim contextMenuStripColumnHeaders As New ContextMenuStrip()
|
||||
|
||||
contextMenuStripColumnHeaders.Items.Add ("Column Header Context Menu Item 1")
|
||||
contextMenuStripColumnHeaders.Items.Add ("Column Header Context Menu Item 2")
|
||||
|
||||
ListView.ContextMenuStripColumns = contextMenuStripColumnHeaders
|
||||
|
||||
' set item context menu
|
||||
Dim contextMenuStripItems As New ContextMenuStrip()
|
||||
|
||||
contextMenuStripItems.Items.Add ("Item Context Menu Item 1")
|
||||
contextMenuStripItems.Items.Add ("Item Context Menu Item 2")
|
||||
|
||||
ListView.ContextMenuStripItems = contextMenuStripItems
|
||||
|
||||
' set group context menu
|
||||
Dim contextMenuStripGroups As New ContextMenuStrip()
|
||||
|
||||
contextMenuStripGroups.Items.Add ("Group Context Menu Item 1")
|
||||
contextMenuStripGroups.Items.Add ("Group Context Menu Item 2")
|
||||
|
||||
ListView.ContextMenuStripGroups = contextMenuStripGroups</code></pre>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-columns.html"><strong>
|
||||
« Columns</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-data.html"><strong>Data Binding »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,437 @@
|
||||
<!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>Data Binding</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-context-menus.html"><strong>
|
||||
« Context Menus</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-drag-drop.html"><strong>Drag and Drop »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Data Binding</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<p>Better ListView supports both <strong><em>lookup</em></strong> binding and
|
||||
<strong><em>complex</em></strong> binding of user-provided data.</p>
|
||||
|
||||
<p>Complex binding allows you use any list-type collection (implementing
|
||||
<span class="code">IList</span> or <span class="code">IListSource</span>) to the control. Complex
|
||||
binding is not a feature of all WinForms controls.</p>
|
||||
|
||||
<p>Regular .NET ListView does not support binding of lists.</p>
|
||||
|
||||
<p>Lookup binding is supported on any WinForms control automatically, so
|
||||
we won't cover the topic here.</p>
|
||||
|
||||
<h2>Basic Data Binding</h2>
|
||||
|
||||
|
||||
<p>To bind a custom <span class="code">IList</span> instance, set the
|
||||
<span class="code">DataSource</span> property:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">listView.DataSource = myList; // myList is of type List<Person></code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">ListView.DataSource = myList ' myList is of type List(Of Person)()</code></pre>
|
||||
|
||||
<p>This fills Better ListView with objects in
|
||||
<span class="code">myList</span>:</p>
|
||||
|
||||
<p class="images"><img src="data-simple.png"></p>
|
||||
|
||||
<p>When converting <span class="code">Person</span> objects to items, Better
|
||||
ListView first looks if there is a <span class="code">TypeConverter</span> defined to
|
||||
use <span class="code">ConvertToString</span> method. If not, standard
|
||||
<span class="code">ToString</span> method is called to obtain item text.</p>
|
||||
|
||||
|
||||
<h2>Displaying Custom Properties</h2>
|
||||
|
||||
|
||||
<p>To display value of some specific property of the bound object, use
|
||||
the <span class="code">DisplayMember</span> property. For example, if we set the
|
||||
<span class="code">DisplayMember</span> to "Age", Better ListView will represent each
|
||||
<span class="code">Person</span> object by its <span class="code">Age</span> property:</p>
|
||||
|
||||
<p class="images"><img src="data-displaymember.png"></p>
|
||||
|
||||
<p>The <span class="code">DisplayMember</span> property can be set on columns as
|
||||
well, so that each column can display another property of the bound
|
||||
object.</p>
|
||||
|
||||
|
||||
<h2>Working with Values instead of Items</h2>
|
||||
|
||||
|
||||
<p>Each column in Better ListView can represent different property of
|
||||
the bound object. The property can be specified using
|
||||
<span class="code">ValueMember</span> property (also on each column using
|
||||
<span class="code">BetterListViewColumnHeader.ValueMember</span>). When specified, the
|
||||
property value can be accessed using the
|
||||
<span class="code">BetterListViewItem.Value</span>
|
||||
(<span class="code">BetterListViewSubItem.Value</span>).</p>
|
||||
|
||||
<p>For example, if we set <span class="code">ValueMember</span> to "Age", each item
|
||||
will have the <span class="code">Value</span> property set to corresponding short with
|
||||
the person's age.</p>
|
||||
|
||||
<p>You can also use following properties to work with selection in
|
||||
terms of the bound objects (values):</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">SelectedValue</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">SelectedValues</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<h2>Binding Columns</h2>
|
||||
|
||||
|
||||
<p>It is possible to display object properties in columns simply by
|
||||
setting <span class="code">DataBindColumns</span> to <span class="code">true</span>. This will cause
|
||||
Better ListView to generate column for each public property of provided
|
||||
list item type automatically:</p>
|
||||
|
||||
<p class="images"><img src="data-bindcolumns.png"></p>
|
||||
|
||||
<p>Here the <span class="code">List<Person></span> object is bound. The
|
||||
<span class="code">Person</span> type contains three public properties:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">Name</span> (<span class="code">String</span>)</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Age (<span class="code">short</span>)</p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">Gender</span> (enum of type
|
||||
<span class="code">PersonGender</span>)</p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>Column header texts are generated from property names.
|
||||
<span class="code">DisplayNameAttribute</span> can be used on the property to specify
|
||||
custom name (as used in the <strong><em>Age</em></strong> column).</p>
|
||||
|
||||
|
||||
<h2>Binding Position</h2>
|
||||
|
||||
|
||||
<p>Data binding mechanism in WinForms keeps information about current
|
||||
position in the bound list. Better ListView synchronizes current position
|
||||
with its selection.</p>
|
||||
|
||||
<p>To turn off this behvior, set <span class="code">DataBindPosition</span> property
|
||||
to <span class="code">false</span>. In this case, Better ListView selection will be
|
||||
independent on current position in the bound list.</p>
|
||||
|
||||
|
||||
<h2>Sorting Items</h2>
|
||||
|
||||
|
||||
<p>Item sorting can be a nontrivial update of the bound list (which is
|
||||
unsupported by the standard data binding mechanism).</p>
|
||||
|
||||
<p><span class="code">SortVirtual</span> property should be set to <span class="code">true</span>
|
||||
to turn off physical update of the <span class="code">Items</span> collection. The
|
||||
columns will still display sort glyphs and the <span class="code">SortList</span> will
|
||||
contain new sort state information, so the manual sorting is
|
||||
possible.</p>
|
||||
|
||||
<p>For example, if we have <span class="code">Person[]</span> array bound, we can
|
||||
sort it manually in the <span class="code">AfterItemSort</span> event handler this
|
||||
way:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">// get values from the data source
|
||||
Person[] values = (Person[])this.listView.DataSource;
|
||||
|
||||
// get listview items as keys
|
||||
BetterListViewItem[] keys = new BetterListViewItem[values.Length];
|
||||
|
||||
this.listView.Items.CopyTo(keys, 0);
|
||||
|
||||
// create custom comparer
|
||||
BetterListViewItemComparer comparer = this.listView.ItemComparer;
|
||||
|
||||
comparer.SetSortList(this.listView.SortList, this.listView.Columns, true);
|
||||
|
||||
// sort the data
|
||||
Array.Sort(keys, values, comparer);
|
||||
|
||||
// refresh view
|
||||
((CurrencyManager)this.listView.BindingContext[this.listView.DataSource]).Refresh();</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">' get values from the data source
|
||||
Dim values As Person() = DirectCast(Me.ListView.DataSource, Person())
|
||||
|
||||
' get listview items as keys
|
||||
Dim keys As BetterListViewItem() = New BetterListViewItem(values.Length - 1) {}
|
||||
|
||||
Me.ListView.Items.CopyTo(keys, 0)
|
||||
|
||||
' create custom comparer
|
||||
Dim comparer As BetterListViewItemComparer = Me.ListView.ItemComparer
|
||||
|
||||
comparer.SetSortList(Me.ListView.SortList, Me.ListView.Columns, True)
|
||||
|
||||
' sort the data
|
||||
Array.Sort(keys, values, comparer)
|
||||
|
||||
' refresh view
|
||||
DirectCast(Me.ListView.BindingContext(Me.ListView.DataSource), CurrencyManager).Refresh()</code></pre>
|
||||
|
||||
<p>Sorting can also be achieved by using <span class="code">DataTable</span>,
|
||||
<span class="code">DataView</span> or other type that supports sorting while bound to a
|
||||
control (such types implement <span class="code">IBindingList</span>) as a data
|
||||
source:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">// get data source
|
||||
DataTable dataTable = (DataTable)this.listView.DataSource;
|
||||
|
||||
// set sort
|
||||
dataTable.DefaultView.Sort = "Name ASC, Age DESC";
|
||||
|
||||
// refresh view
|
||||
(((CurrencyManager)this.listView.BindingContext[this.listView.DataSource]).Refresh();</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">' get data source
|
||||
Dim dataTable As DataTable = DirectCast(Me.ListView.DataSource, DataTable)
|
||||
|
||||
' set sort
|
||||
dataTable.DefaultView.Sort = "Name ASC, Age DESC"
|
||||
|
||||
' refresh view
|
||||
DirectCast(Me.ListView.BindingContext(Me.ListView.DataSource), CurrencyManager).Refresh()</code></pre>
|
||||
|
||||
|
||||
<h2>Sorting by Value</h2>
|
||||
|
||||
|
||||
<p>Items can be sorted by other than displayed value when
|
||||
<span class="code">ValueMember</span> property is set.</p>
|
||||
|
||||
<p>For example, we have a <span class="code">DataTable</span> with columns
|
||||
"<strong><em>PercentDone</em></strong>" - which contains numeric values - and
|
||||
"<strong><em>PercentDoneDisplay</em></strong>" which contains corresponding
|
||||
values for display (e.g. rounded, with percent sign). Setting
|
||||
<span class="code">DisplayMember</span> property on the column for percentage to
|
||||
"<strong><em>PercentDoneDisplay</em></strong>" and <span class="code">ValueMember</span>
|
||||
property to "<strong><em>PercentDone</em></strong>" causes sorting according to
|
||||
value in numeric column.</p>
|
||||
|
||||
<p>Values are used for sorting only when the <span class="code">Key</span> property
|
||||
of a sub-item is not available. The <span class="code">Key</span> property has the
|
||||
highest priority when sorting, then the <span class="code">Value</span> property, and
|
||||
then the <span class="code">Text</span> property.</p>
|
||||
|
||||
<p>Following image shows multi-column sorting of a bound
|
||||
<span class="code">DataTable</span> - the table is sorted according to column with
|
||||
aspect ratio enumeration (invisible, showing another column with display
|
||||
values) and a numeric column (percentage):</p>
|
||||
|
||||
<p class="images"><img src="data-sort.png"></p>
|
||||
|
||||
|
||||
<h2>Reordering Items and Columns</h2>
|
||||
|
||||
|
||||
<p>When some data is bound to Better ListView and columns are
|
||||
reordered, the control automatically performs refresh of the data (this is
|
||||
the case of <span class="code">ColumnReorderMode</span> set to
|
||||
<span class="code">Enabled</span>).</p>
|
||||
|
||||
<p>Automatic item reordering is restricted to happen on the same item
|
||||
level or between different levels, but only when none of the levels are
|
||||
the top level.</p>
|
||||
|
||||
<p>Item reordering with data binding should be implemented in the
|
||||
similar manner as item sorting. First, set the
|
||||
<span class="code">ItemReorderMode</span> property to <span class="code">Custom</span>. Then
|
||||
implement the custom reordering logic on data source in the
|
||||
<span class="code">AfterItemReorder</span> event handler.</p>
|
||||
|
||||
|
||||
<h2>Sample Source Code</h2>
|
||||
|
||||
|
||||
<p>The following sample will binds a list of <span class="code">Person</span>
|
||||
objects to Better ListView:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">// create a list of Person objects
|
||||
List&lt;Person&gt; persons = new List&lt;Person&gt;(new[]
|
||||
{
|
||||
new Person("Lee Adama", 45),
|
||||
new Person("Sally Gordon", 26),
|
||||
new Person("John Grant", 18),
|
||||
new Person("Susan Hutchinson", 37)
|
||||
});
|
||||
|
||||
// create columns automatically
|
||||
this.listView.DataBindColumns = true;
|
||||
|
||||
// populate ListView with our data
|
||||
this.listView.DataSource = persons;</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">' create a list of Person objects
|
||||
Dim persons As New List(Of Person)(
|
||||
New Person() { _
|
||||
New Person("Lee Adama", 45),
|
||||
New Person("Sally Gordon", 26),
|
||||
New Person("John Grant", 18),
|
||||
New Person("Susan Hutchinson", 37)
|
||||
})
|
||||
|
||||
' create columns automatically
|
||||
ListView.DataBindColumns = True
|
||||
|
||||
' populate ListView with our data
|
||||
ListView.DataSource = persons</code></pre>
|
||||
|
||||
<p>The <span class="code">Person</span> class itself is particularly simple - it
|
||||
does not need to provide anything else than public properties which are
|
||||
bound:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">/// <summary>
|
||||
/// Represents a simple data object (a person).
|
||||
/// </summary>
|
||||
internal sealed class Person
|
||||
{
|
||||
/// <summary>
|
||||
/// Gets or sets the name of the person.
|
||||
/// </summary>
|
||||
/// <value>
|
||||
/// The name of the person.
|
||||
/// </value>
|
||||
public string Name
|
||||
{
|
||||
get;
|
||||
set;
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// Gets or sets the age of the person.
|
||||
/// </summary>
|
||||
/// <value>
|
||||
/// The age of the person.
|
||||
/// </value>
|
||||
public int Age
|
||||
{
|
||||
get;
|
||||
set;
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// Initializes a new instance of the <see cref = "Person" /> class.
|
||||
/// </summary>
|
||||
/// <param name = "name">The name of the person.</param>
|
||||
/// <param name = "age">The age of the person.</param>
|
||||
public Person(string name, int age)
|
||||
{
|
||||
Name = name;
|
||||
Age = age;
|
||||
}
|
||||
}</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">''' <summary>
|
||||
''' Represents a simple data object (a person).
|
||||
''' </summary>
|
||||
Friend NotInheritable Class Person
|
||||
|
||||
''' <summary>
|
||||
''' Gets or sets the name of the person.
|
||||
''' </summary>
|
||||
''' <value>
|
||||
''' The name of the person.
|
||||
''' </value>
|
||||
Public Property Name() As String
|
||||
Get
|
||||
Return _mName
|
||||
End Get
|
||||
Set(ByVal value As String)
|
||||
_mName = value
|
||||
End Set
|
||||
End Property
|
||||
|
||||
''' <summary>
|
||||
''' Gets or sets the age of the person.
|
||||
''' </summary>
|
||||
''' <value>
|
||||
''' The age of the person.
|
||||
''' </value>
|
||||
Public Property Age() As Integer
|
||||
Get
|
||||
Return _mAge
|
||||
End Get
|
||||
Set(ByVal value As Integer)
|
||||
_mAge = value
|
||||
End Set
|
||||
End Property
|
||||
|
||||
Private _mName As String
|
||||
Private _mAge As Integer
|
||||
|
||||
''' <summary>
|
||||
''' Initializes a new instance of the <see cref = "Person" /> class.
|
||||
''' </summary>
|
||||
''' <param name = "Name">The name of the person.</param>
|
||||
''' <param name = "Age">The age of the person.</param>
|
||||
Public Sub New(ByVal Name As String, ByVal Age As Integer)
|
||||
Me.Name = Name
|
||||
Me.Age = Age
|
||||
End Sub
|
||||
|
||||
End Class</code></pre>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-context-menus.html"><strong>
|
||||
« Context Menus</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-drag-drop.html"><strong>Drag and Drop »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,441 @@
|
||||
<!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>Drag and Drop</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-data.html"><strong>
|
||||
« Data Binding</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-embedded-controls.html"><strong>Embedded Controls »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Drag and Drop</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<p>The basic Drag and Drop functionality allows user to move data between
|
||||
two controls: drag source and drop target. Regular .NET ListView does
|
||||
support this basic Drag and Drop functionality, but not any additional (and
|
||||
often pleasant) features based on Drag and Drop.</p>
|
||||
|
||||
<p>Better ListView adds these features:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p>Item reordering</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Drop highlighting</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Insertion marks</p>
|
||||
</li>
|
||||
</ul>
|
||||
<h2>Setting up Better ListView as a Drag Source</h2>
|
||||
|
||||
|
||||
<p>Three properties are essential for setting up Better ListView as a
|
||||
drag source:</p>
|
||||
|
||||
<ul style="list-style:none">
|
||||
<li>
|
||||
<span class="code">AllowedDragEffects</span><ul style="list-style:none"><li>
|
||||
<p>Used when Drag and Drop operation is initiated. This tells the
|
||||
Drag and Drop mechanism, what effects on mouse cursor can be shown
|
||||
while dragging some data.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">AllowDrag</span><ul style="list-style:none"><li>
|
||||
<p>Simply switches the ability of Better ListView to behave as
|
||||
drag source.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">ItemReorderMode</span><ul style="list-style:none"><li>
|
||||
<p>Sets the behavior of item reordering.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
</ul>
|
||||
<h2>Item Reordering</h2>
|
||||
|
||||
|
||||
<br><hr>
|
||||
<p class="note">Item reordering feature is not supported in <strong><em>Better
|
||||
ListView Express</em></strong>.</p>
|
||||
<hr>
|
||||
<br><p>Item reordering is enabled by setting <span class="code">ItemReorderMode</span>
|
||||
property to either <span class="code">Enabled</span> or <span class="code">Custom</span>. The
|
||||
difference between these values is that on <span class="code">Enabled</span> Better
|
||||
ListView does all the item reordering automatically (items will be
|
||||
actually reordered in the list), but <span class="code">Custom</span> shows only the
|
||||
effect, fires item reorder events and the actual reordering is expected to
|
||||
be done externally. This is practical - for example - when one displays
|
||||
confirmation dialog to proceed reordering or just needs to deny the
|
||||
reordering in some cases.</p>
|
||||
|
||||
<p>This image shows item reordering in action:</p>
|
||||
|
||||
<p class="images"><img src="drag-drop-reordering.png"></p>
|
||||
|
||||
|
||||
<h2>Drag Effects</h2>
|
||||
|
||||
|
||||
<p>There are two effect available while dragging over Better
|
||||
ListView.</p>
|
||||
|
||||
<p><span class="code">DropHighlight</span> looks like a hot state of an item. It
|
||||
shows when user is dragging data over an item. It is useful when data are
|
||||
to be dropped on a certain item:</p>
|
||||
|
||||
<p class="images"><img src="drag-drop-dropeffect1.png"></p>
|
||||
|
||||
<p><span class="code">InsertionMark</span> is a line showing target position between
|
||||
neighboring items. It is useful for inserting data in the list or item
|
||||
reordering:</p>
|
||||
|
||||
<p class="images"><img src="drag-drop-dropeffect2.png"></p>
|
||||
|
||||
|
||||
<h2>Internal and External Drop Display</h2>
|
||||
|
||||
|
||||
<p>There are two properties governing the effect during Drag and Drop
|
||||
operation: <span class="code">ItemDropDisplayInternal</span> and
|
||||
<span class="code">ItemDropDisplayExternal</span>.</p>
|
||||
|
||||
<p>Internal drop display is used when source and target of the
|
||||
drag-drop operation is the same. This effect is <span class="code">InsertionMark</span>
|
||||
by default and refers to item reordering.</p>
|
||||
|
||||
<p>External drop display is used when data are dragged from another
|
||||
control. This effect is <span class="code">DropHighlight</span> by default.
|
||||
<span class="code">DropHighlight</span> can be disabled on selected items by setting
|
||||
<span class="code">AllowDropHighlight</span> property to <span class="code">false</span>.</p>
|
||||
|
||||
|
||||
<h2>Default Format of Dragged Data</h2>
|
||||
|
||||
|
||||
<p>Items can be dragged between different Better ListViews, other
|
||||
controls and even across application domains (between applications).
|
||||
Better ListView uses its own structure of type
|
||||
<span class="code">BetterListViewItemDragData</span>.</p>
|
||||
|
||||
<p><span class="code">BetterListViewItemDragData</span> contains both dragged item
|
||||
indices and cloned items. Items are cloned because when the dragged data
|
||||
crosses application domain, it is serialized and must not contain any
|
||||
reference to source Better ListView since such objects cannot be
|
||||
transferred through this channel. For the purpose of indentifying drag
|
||||
source control, <span class="code">BetterListViewItemDragData</span> contains
|
||||
globally-unique ID of the Better ListView
|
||||
(<span class="code">BetterListView.DragSourceID</span> property).</p>
|
||||
|
||||
|
||||
<h2>Sample Source Code</h2>
|
||||
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">//
|
||||
// setup the first Better ListView
|
||||
//
|
||||
this.listView1.BeginUpdate();
|
||||
|
||||
this.listView1.Items.AddRange(
|
||||
new[]
|
||||
{
|
||||
"A Fork",
|
||||
"A Spoon",
|
||||
"A Knife"
|
||||
});
|
||||
|
||||
this.listView1.AutoSizeItemsInDetailsView = true;
|
||||
|
||||
this.listView1.EndUpdate();
|
||||
|
||||
// allow dragging items from this list
|
||||
this.listView1.AllowDrag = true;
|
||||
// allow dropping items on this list
|
||||
this.listView1.AllowDrop = true;
|
||||
// show insertion mark when dragging over this list
|
||||
this.listView1.ItemDropDisplayExternal = BetterListViewDragDropDisplay.InsertionMark;
|
||||
|
||||
// this event has to be handled to properly set some effect (e.g. 'Move') when dragging
|
||||
this.listView1.DragDropEffectSetting += ListViewDragDropEffectSetting;
|
||||
// this event tells us that user dropped data on some item of the Better ListView (DragDrop event is more general than this)
|
||||
this.listView1.ItemDrop += ListViewItemDrop;
|
||||
// handle the case when user drops item(s) on empty list - in that case ItemDrop is not raised and we should use DragDrop
|
||||
this.listView1.DragDrop += ListViewDragDrop;
|
||||
|
||||
//
|
||||
// setup the second Better ListView
|
||||
//
|
||||
this.listView2.BeginUpdate();
|
||||
|
||||
this.listView2.Items.AddRange(
|
||||
new[]
|
||||
{
|
||||
"A Chair",
|
||||
"A Table",
|
||||
"A Wardrobe"
|
||||
});
|
||||
|
||||
this.listView2.AllowDrag = true;
|
||||
this.listView2.AllowDrop = true;
|
||||
this.listView2.ItemDropDisplayExternal = BetterListViewDragDropDisplay.InsertionMark;
|
||||
|
||||
this.listView2.AutoSizeItemsInDetailsView = true;
|
||||
|
||||
this.listView2.EndUpdate();
|
||||
|
||||
this.listView2.DragDropEffectSetting += ListViewDragDropEffectSetting;
|
||||
this.listView2.ItemDrop += ListViewItemDrop;
|
||||
this.listView2.DragDrop += ListViewDragDrop;</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">'
|
||||
' setup the first Better ListView
|
||||
'
|
||||
ListView1.BeginUpdate()
|
||||
|
||||
ListView1.Items.AddRange(
|
||||
New String() {
|
||||
"A Fork",
|
||||
"A Spoon",
|
||||
"A Knife"
|
||||
})
|
||||
|
||||
ListView1.AutoSizeItemsInDetailsView = True
|
||||
|
||||
ListView1.EndUpdate()
|
||||
|
||||
' allow dragging items from this list
|
||||
ListView1.AllowDrag = True
|
||||
' allow dropping items on this list
|
||||
ListView1.AllowDrop = True
|
||||
' show insertion mark when dragging over this list
|
||||
ListView1.ItemDropDisplayExternal = BetterListViewDragDropDisplay.InsertionMark
|
||||
|
||||
' this event has to be handled to properly set some effect (e.g. 'Move') when dragging
|
||||
AddHandler ListView1.DragDropEffectSetting, AddressOf ListViewDragDropEffectSetting
|
||||
' this event tells us that user dropped data on some item of the Better ListView (DragDrop event is more general than this)
|
||||
AddHandler ListView1.ItemDrop, AddressOf ListViewItemDrop
|
||||
' handle the case when user drops item(s) on empty list - in that case ItemDrop is not raised and we should use DragDrop
|
||||
AddHandler ListView1.DragDrop, AddressOf ListViewDragDrop
|
||||
|
||||
'
|
||||
' setup the second Better ListView
|
||||
'
|
||||
ListView2.BeginUpdate()
|
||||
|
||||
ListView2.Items.AddRange(
|
||||
New String() {
|
||||
"A Chair",
|
||||
"A Table",
|
||||
"A Wardrobe"
|
||||
})
|
||||
|
||||
ListView2.AllowDrag = True
|
||||
ListView2.AllowDrop = True
|
||||
ListView2.ItemDropDisplayExternal = BetterListViewDragDropDisplay.InsertionMark
|
||||
|
||||
ListView2.AutoSizeItemsInDetailsView = True
|
||||
|
||||
ListView2.EndUpdate()
|
||||
|
||||
AddHandler ListView2.DragDropEffectSetting, AddressOf ListViewDragDropEffectSetting
|
||||
AddHandler ListView2.ItemDrop, AddressOf ListViewItemDrop
|
||||
AddHandler ListView2.DragDrop, AddressOf ListViewDragDrop</code></pre>
|
||||
|
||||
<p>Source code for the <span class="code">ListViewDragDropEffectSetting</span>
|
||||
event:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">void ListViewDragDropEffectSetting(object sender, BetterListViewDragDropEffectSettingEventArgs eventArgs)
|
||||
{
|
||||
BetterListViewItemDragData itemDragData = (BetterListViewItemDragData)eventArgs.Data.GetData(typeof(BetterListViewItemDragData));
|
||||
|
||||
Control child = GetChildAtPoint(PointToClient(new Point(eventArgs.X, eventArgs.Y)));
|
||||
|
||||
if (child is BetterListView &&
|
||||
((BetterListView)child).DragSourceID == itemDragData.DragSourceID) // check whether the data comes from this cotnrol
|
||||
{
|
||||
// do not allow dropping on the source control
|
||||
eventArgs.Effect = DragDropEffects.None;
|
||||
}
|
||||
else
|
||||
{
|
||||
eventArgs.Effect = DragDropEffects.Move;
|
||||
}
|
||||
}</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">Sub ListViewDragDropEffectSetting(ByVal sender As Object, ByVal eventArgs As BetterListViewDragDropEffectSettingEventArgs)
|
||||
|
||||
Dim itemDragData As BetterListViewItemDragData = DirectCast(eventArgs.Data.GetData(GetType(BetterListViewItemDragData)), BetterListViewItemDragData)
|
||||
|
||||
Dim child As Control = GetChildAtPoint(PointToClient(New Point(eventArgs.X, eventArgs.Y)))
|
||||
|
||||
If TypeOf child Is BetterListView.BetterListView AndAlso DirectCast(child, BetterListView.BetterListView).DragSourceID = itemDragData.DragSourceID Then
|
||||
|
||||
' check whether the data comes from this cotnrol
|
||||
' do not allow dropping on the source control
|
||||
eventArgs.Effect = DragDropEffects.None
|
||||
|
||||
Else
|
||||
eventArgs.Effect = DragDropEffects.Move
|
||||
End If
|
||||
|
||||
End Sub</code></pre>
|
||||
|
||||
<p>Source code for the <span class="code">ListViewItemDrop</span> event:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">void ListViewItemDrop(object sender, BetterListViewItemDropEventArgs eventArgs)
|
||||
{
|
||||
BetterListViewItemDragData itemDragData = (BetterListViewItemDragData)eventArgs.Data.GetData(typeof(BetterListViewItemDragData));
|
||||
|
||||
BetterListView listViewSource = GetSourceList(itemDragData);
|
||||
BetterListView listViewTarget = GetTargetList(itemDragData);
|
||||
|
||||
// remove items from the source list
|
||||
listViewSource.Items.RemoveRange(itemDragData.Items);
|
||||
|
||||
// insert items to the target list (either before or after the target item, depending on the insertion location)
|
||||
listViewTarget.Items.InsertRange(
|
||||
(eventArgs.ItemDropPart == BetterListViewDropPart.After)
|
||||
? (eventArgs.Item.Index + 1)
|
||||
: eventArgs.Item.Index,
|
||||
itemDragData.Items);
|
||||
}</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">Sub ListViewItemDrop(ByVal sender As Object, ByVal eventArgs As BetterListViewItemDropEventArgs)
|
||||
|
||||
Dim itemDragData As BetterListViewItemDragData = DirectCast(eventArgs.Data.GetData(GetType(BetterListViewItemDragData)), BetterListViewItemDragData)
|
||||
|
||||
Dim listViewSource As BetterListView.BetterListView = GetSourceList(itemDragData)
|
||||
Dim listViewTarget As BetterListView.BetterListView = GetTargetList(itemDragData)
|
||||
|
||||
' remove items from the source list
|
||||
listViewSource.Items.RemoveRange(itemDragData.Items)
|
||||
|
||||
' insert items to the target list (either before or after the target item, depending on the insertion location)
|
||||
listViewTarget.Items.InsertRange(If((eventArgs.ItemDropPart = BetterListViewDropPart.After), (eventArgs.Item.Index + 1), eventArgs.Item.Index), itemDragData.Items)
|
||||
|
||||
End Sub</code></pre>
|
||||
|
||||
<p>Source code for the <span class="code">ListViewDragDrop</span> event:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">void ListViewDragDrop(object sender, DragEventArgs e)
|
||||
{
|
||||
BetterListViewItemDragData itemDragData = (BetterListViewItemDragData)e.Data.GetData(typeof(BetterListViewItemDragData));
|
||||
|
||||
BetterListView listViewSource = GetSourceList(itemDragData);
|
||||
BetterListView listViewTarget = GetTargetList(itemDragData);
|
||||
|
||||
if (listViewTarget.Items.Count == 0)
|
||||
{
|
||||
// remove items from the source list
|
||||
listViewSource.Items.RemoveRange(itemDragData.Items);
|
||||
|
||||
// add items to the target list
|
||||
listViewTarget.Items.AddRange(itemDragData.Items);
|
||||
}
|
||||
}</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">Sub ListViewDragDrop(ByVal sender As Object, ByVal e As DragEventArgs)
|
||||
|
||||
Dim itemDragData As BetterListViewItemDragData = DirectCast(e.Data.GetData(GetType(BetterListViewItemDragData)), BetterListViewItemDragData)
|
||||
|
||||
Dim listViewSource As BetterListView.BetterListView = GetSourceList(itemDragData)
|
||||
Dim listViewTarget As BetterListView.BetterListView = GetTargetList(itemDragData)
|
||||
|
||||
If listViewTarget.Items.Count = 0 Then
|
||||
|
||||
' remove items from the source list
|
||||
listViewSource.Items.RemoveRange(itemDragData.Items)
|
||||
|
||||
' add items to the target list
|
||||
listViewTarget.Items.AddRange(itemDragData.Items)
|
||||
|
||||
End If
|
||||
|
||||
End Sub</code></pre>
|
||||
|
||||
<p>Source code for the <span class="code">GetSourceList</span> and
|
||||
<span class="code">GetTargetList</span> methods:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">BetterListView GetSourceList(BetterListViewItemDragData itemDragData)
|
||||
{
|
||||
return ((itemDragData.DragSourceID == this.listView1.DragSourceID) // check whether the data comes from the first ListView
|
||||
? this.listView1
|
||||
: this.listView2);
|
||||
}
|
||||
|
||||
BetterListView GetTargetList(BetterListViewItemDragData itemDragData)
|
||||
{
|
||||
return ((itemDragData.DragSourceID == this.listView1.DragSourceID) // check whether the data comes from the first ListView
|
||||
? this.listView2
|
||||
: this.listView1);
|
||||
}</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">Function GetSourceList(ByVal itemDragData As BetterListViewItemDragData) As BetterListView.BetterListView
|
||||
|
||||
' check whether the data comes from the first ListView
|
||||
Return (If((itemDragData.DragSourceID = ListView1.DragSourceID), ListView1, ListView2))
|
||||
|
||||
End Function
|
||||
|
||||
Function GetTargetList(ByVal itemDragData As BetterListViewItemDragData) As BetterListView.BetterListView
|
||||
|
||||
' check whether the data comes from the first ListView
|
||||
Return (If((itemDragData.DragSourceID = ListView1.DragSourceID), ListView2, ListView1))
|
||||
|
||||
End Function</code></pre>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-data.html"><strong>
|
||||
« Data Binding</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-embedded-controls.html"><strong>Embedded Controls »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,720 @@
|
||||
<!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>Embedded Controls</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-drag-drop.html"><strong>
|
||||
« Drag and Drop</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-empty-text.html"><strong>Empty Text »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Embedded Controls</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<p>Embedded editing controls can be thought of as an extension to label
|
||||
edit functionality (see <strong><em><a href="chapter-label-edit.html">Label
|
||||
Editing</a></em></strong> for more information).</p>
|
||||
|
||||
<p>Every item and sub-item has a <strong><em>cell</em></strong> area on which
|
||||
an editing control can be placed. In the simplest case
|
||||
(<span class="code">LabelEdit</span> set to <span class="code">true</span>), the editing control is
|
||||
basically a <span class="code">System.Windows.Forms.TextBox</span> control. It is
|
||||
actually an instance of <span class="code">BetterListViewTextBoxEmbeddedControl</span>,
|
||||
which is a <span class="code">TextBox</span> wrapper implementing
|
||||
<span class="code">IBetterListViewEmbeddedControl</span> interface. Any control can be
|
||||
used as embedded control in Bettter ListView if implements one of these
|
||||
interfaces:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">IBetterListViewEmbeddedControl </span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">IBetterListViewEmbeddedControlExtended</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>The custom embedded control is shown on the image below. When user
|
||||
clicks on sub-item text (an abbreviation of tea grading), an editing control
|
||||
appears on the top-left corner of the cell area. The control contains
|
||||
buttons for accepting and cancelling changes:</p>
|
||||
|
||||
<p class="images"><img src="embedded-control.png"></p>
|
||||
|
||||
<h2>Implementing IBetterListViewEmbeddedControl</h2>
|
||||
|
||||
|
||||
<p>This interface contains prescription for minimum amount of
|
||||
functionality required by an embedded control:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p>Get label text for currently edited data.</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Data accepting and cancelling events (e.g. if the control has an
|
||||
OK button).</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Set control size given the cell area and positioning
|
||||
data.</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Move data from sub-item to the control.</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Move data from the control to the sub-item.</p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>Let's make a sample control. We will make a
|
||||
<span class="code">TextBox</span>-based embedded control for editing words in
|
||||
lower-case. First, we inherit <span class="code">TextBox</span> and implement
|
||||
<span class="code">IBetterListViewEmbeddedControl</span> interface:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">/// <summary>
|
||||
/// Represents a custom control embeddable in Better ListView.
|
||||
/// </summary>
|
||||
public class TextBoxEmbeddedControl : TextBox, IBetterListViewEmbeddedControl</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">''' <summary>
|
||||
''' Represents a custom control embeddable in Better ListView.
|
||||
''' </summary>
|
||||
Public Class TextBoxEmbeddedControl
|
||||
Inherits TextBox
|
||||
Implements IBetterListViewEmbeddedControl</code></pre>
|
||||
|
||||
<p>Then we implement the <span class="code">LabelText</span> property:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">/// <summary>
|
||||
/// current (edited) label text
|
||||
/// </summary>
|
||||
public string LabelText
|
||||
{
|
||||
get
|
||||
{
|
||||
return Text.ToLower();
|
||||
}
|
||||
}</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">''' <summary>
|
||||
''' current (edited) label text
|
||||
''' </summary>
|
||||
Public ReadOnly Property LabelText() As String
|
||||
Get
|
||||
Return Text.ToLower()
|
||||
End Get
|
||||
End Property</code></pre>
|
||||
|
||||
<p>As you can see, the text of the <span class="code">TextBox</span> is converted to
|
||||
lower case since we want item/sub-item labels to be only in lower
|
||||
case.</p>
|
||||
|
||||
<p>Next, we implement <span class="code">RequestAccept</span> and
|
||||
<span class="code">RequestCancel</span> events:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">/// <summary>
|
||||
/// request accepting updated data in BetterListView
|
||||
/// </summary>
|
||||
public event EventHandler RequestAccept;
|
||||
|
||||
/// <summary>
|
||||
/// request cancelling editing
|
||||
/// </summary>
|
||||
public event EventHandler RequestCancel;</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">''' <summary>
|
||||
''' request accepting updated data in BetterListView
|
||||
''' </summary>
|
||||
Public Event RequestAccept As EventHandler Implements IBetterListViewEmbeddedControl.RequestAccept
|
||||
|
||||
''' <summary>
|
||||
''' request cancelling editing
|
||||
''' </summary>
|
||||
Public Event RequestCancel As EventHandler Implements IBetterListViewEmbeddedControl.RequestCancel</code></pre>
|
||||
|
||||
<p>Next, we implement <span class="code">GetData</span> and <span class="code">SetData</span>
|
||||
methods:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">/// <summary>
|
||||
/// get data from the specified sub-item in control
|
||||
/// </summary>
|
||||
/// <param name = "subItem">sub-item whose data are being edited</param>
|
||||
public void GetData(BetterListViewSubItem subItem)
|
||||
{
|
||||
Text = subItem.Text;
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// set data from control to the specified sub-item
|
||||
/// </summary>
|
||||
/// <param name = "subItem">sub-item whose data are being edited</param>
|
||||
public void SetData(BetterListViewSubItem subItem)
|
||||
{
|
||||
subItem.Text = LabelText;
|
||||
}</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">''' <summary>
|
||||
''' get data from the specified sub-item in control
|
||||
''' </summary>
|
||||
''' <param name = "subItem">sub-item whose data are being edited</param>
|
||||
Public Sub GetData(ByVal subItem As BetterListViewSubItem) Implements IBetterListViewEmbeddedControl.GetData
|
||||
|
||||
Text = subItem.Text
|
||||
|
||||
End Sub
|
||||
|
||||
''' <summary>
|
||||
''' set data from control to the specified sub-item
|
||||
''' </summary>
|
||||
''' <param name = "subItem">sub-item whose data are being edited</param>
|
||||
Public Sub SetData(ByVal subItem As BetterListViewSubItem) Implements IBetterListViewEmbeddedControl.SetData
|
||||
|
||||
subItem.Text = LabelText
|
||||
|
||||
End Sub</code></pre>
|
||||
|
||||
<p>These method are trivial since we need not to do any data
|
||||
conversions (the only conversion here is lowering the case of edited text
|
||||
in the <span class="code">LabelText</span> getter).</p>
|
||||
|
||||
<p>The last method contained in the interface is <span class="code">SetSize</span>
|
||||
method, which needs not to be implemented (the body can be kept empty).
|
||||
You implement this method only if you need to adjust control's size when
|
||||
label edit starts.</p>
|
||||
|
||||
<p>The constructor should be implemented like this:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">/// <summary>
|
||||
/// Initializes a new instance of the <see cref = "TextBoxEmbeddedControl" /> class.
|
||||
/// </summary>
|
||||
public TextBoxEmbeddedControl()
|
||||
{
|
||||
AcceptsReturn = true;
|
||||
CausesValidation = false;
|
||||
}</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">''' <summary>
|
||||
''' Initializes a new instance of the <see cref = "TextBoxEmbeddedControl" /> class.
|
||||
''' </summary>
|
||||
Public Sub New()
|
||||
|
||||
AcceptsReturn = True
|
||||
CausesValidation = False
|
||||
|
||||
End Sub</code></pre>
|
||||
|
||||
<p>The <span class="code">AcceptsReturn</span> property is set to <span class="code">true</span>
|
||||
because we will handle the <strong><em>ENTER</em></strong> key (and raise
|
||||
<span class="code">RequestAccept</span> event appropriately).</p>
|
||||
|
||||
<p>The <span class="code">CausesValidation</span> property is set to
|
||||
<span class="code">false</span> because it is a good practice in this situation.</p>
|
||||
|
||||
<p>Both input and output data are validated in the
|
||||
<span class="code">IBetterListViewEmbeddedControl</span> implementation and validation
|
||||
of some third-party controls can prevent whole form with the control from
|
||||
closing.</p>
|
||||
|
||||
<p>The last thing we implement is handling of the
|
||||
<strong><em>ENTER</em></strong> key for accepting the data and the
|
||||
<strong><em>ESCAPE</em></strong> key for cancelling:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">protected override void OnKeyDown(KeyEventArgs e)
|
||||
{
|
||||
if (e.KeyCode == Keys.Enter &&
|
||||
RequestAccept != null)
|
||||
{
|
||||
RequestAccept(this, EventArgs.Empty);
|
||||
|
||||
e.Handled = true;
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
if (e.KeyCode == Keys.Escape &&
|
||||
RequestCancel != null)
|
||||
{
|
||||
RequestCancel(this, EventArgs.Empty);
|
||||
|
||||
e.Handled = true;
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
base.OnKeyDown(e);
|
||||
}</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">Protected Overrides Sub OnKeyDown(e As KeyEventArgs)
|
||||
|
||||
If e.KeyCode = Keys.Enter AndAlso RequestAccept IsNot Nothing Then
|
||||
|
||||
RequestAccept(Me, EventArgs.Empty)
|
||||
|
||||
e.Handled = True
|
||||
|
||||
Return
|
||||
|
||||
End If
|
||||
|
||||
If e.KeyCode = Keys.Escape AndAlso RequestCancel IsNot Nothing Then
|
||||
|
||||
RequestCancel(Me, EventArgs.Empty)
|
||||
|
||||
e.Handled = True
|
||||
|
||||
Return
|
||||
|
||||
End If
|
||||
|
||||
MyBase.OnKeyDown(e)
|
||||
|
||||
End Sub</code></pre>
|
||||
|
||||
<br><hr>
|
||||
<p class="note">It is a common good practice to implement interfaces explicitly.
|
||||
The sample implementation is implicit for the sake of better
|
||||
readability. Embedded controls implemented in BetterListView.dll are
|
||||
implemented implicitly (and marked virtual) to allow for being inherited
|
||||
(e.g. <span class="code">MyCustomControl : BetterListViewEmbeddedControl</span>) and
|
||||
you may possibly want to override any part of the interface
|
||||
implementation.</p>
|
||||
<hr>
|
||||
<br><h2>Implementing IBetterListViewEmbeddedControlExtended</h2>
|
||||
|
||||
|
||||
<p>The extended interface has currently only one method called
|
||||
<span class="code">RequestEndEdit</span>. This method can be called by the Better
|
||||
ListView, when it asks the control whether it is ready to end editing. The
|
||||
control can return a boolean value (<span class="code">true</span> - continue
|
||||
<span class="code">EndEdit</span>, <span class="code">false</span> - refuse to end editing). There
|
||||
are many situations when the label editing is terminated (e.g. scrolling
|
||||
the control, selecting items...) and terminating the label edit is not
|
||||
always wanted (this is a case of
|
||||
<span class="code">System.Windows.Forms.DateTimePicker</span> control, which sometimes
|
||||
behaves as being transparent for mouse clicks and thus being closed
|
||||
because of click-through on the Better ListView client area - the
|
||||
<span class="code">RequestEndEdit</span> method fixes such possible behavior of third
|
||||
party controls).</p>
|
||||
|
||||
|
||||
<h2>Sample Source Code</h2>
|
||||
|
||||
|
||||
<p>Form with Better ListView containing some columns and items:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">/// <summary>
|
||||
/// Shows embedding of custom controls into Better ListView.
|
||||
/// </summary>
|
||||
internal sealed partial class EmbeddedControlSampleForm : Form
|
||||
{
|
||||
/// <summary>
|
||||
/// Initializes a new instance of the <see cref = "EmbeddedControlSampleForm" /> class.
|
||||
/// </summary>
|
||||
public EmbeddedControlSampleForm()
|
||||
{
|
||||
InitializeComponent();
|
||||
|
||||
this.listView.BeginUpdate();
|
||||
|
||||
this.listView.Columns.AddRange(new[]
|
||||
{
|
||||
new BetterListViewColumnHeader("Document name", 160),
|
||||
new BetterListViewColumnHeader("Access", 128)
|
||||
});
|
||||
|
||||
this.listView.Items.AddRange(
|
||||
new[]
|
||||
{
|
||||
new BetterListViewItem(new[] { "hydro-report.pdf", "read" }),
|
||||
new BetterListViewItem(new[] { "magnetic_resonance.docx", "read write" }),
|
||||
new BetterListViewItem(new[] { "billing forms (2011).zip", "read" })
|
||||
});
|
||||
|
||||
this.listView.LabelEditActivation = (BetterListViewLabelEditActivation.Keyboard | BetterListViewLabelEditActivation.SingleClick);
|
||||
this.listView.LabelEditModeSubItems = BetterListViewLabelEditMode.CustomControl;
|
||||
|
||||
this.listView.EndUpdate();
|
||||
|
||||
this.listView.RequestEmbeddedControl += ListViewRequestEmbeddedControl;
|
||||
}
|
||||
|
||||
private IBetterListViewEmbeddedControl ListViewRequestEmbeddedControl(object sender, BetterListViewRequestEmbeddedControlEventArgs eventArgs)
|
||||
{
|
||||
if (eventArgs.SubItem.Index == 1)
|
||||
{
|
||||
return (new DocumentAccessConrol());
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
}</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">''' <summary>
|
||||
''' Shows embedding of custom controls into Better ListView.
|
||||
''' </summary>
|
||||
Partial Friend NotInheritable Class EmbeddedControlSampleForm
|
||||
|
||||
''' <summary>
|
||||
''' Initializes a new instance of the <see cref = "EmbeddedControlSampleForm" /> class.
|
||||
''' </summary>
|
||||
Public Sub New()
|
||||
|
||||
InitializeComponent()
|
||||
|
||||
ListView.BeginUpdate()
|
||||
|
||||
ListView.Columns.AddRange(
|
||||
New BetterListViewColumnHeader() { _
|
||||
New BetterListViewColumnHeader("Document name", 160),
|
||||
New BetterListViewColumnHeader("Access", 128)
|
||||
})
|
||||
|
||||
ListView.Items.AddRange(
|
||||
New BetterListViewItem() { _
|
||||
New BetterListViewItem(New String() {"hydro-report.pdf", "read"}),
|
||||
New BetterListViewItem(New String() {"magnetic_resonance.docx", "read write"}),
|
||||
New BetterListViewItem(New String() {"billing forms (2011).zip", "read"})
|
||||
})
|
||||
|
||||
ListView.LabelEditActivation =
|
||||
(BetterListViewLabelEditActivation.Keyboard Or BetterListViewLabelEditActivation.SingleClick)
|
||||
ListView.LabelEditModeSubItems = BetterListViewLabelEditMode.CustomControl
|
||||
|
||||
ListView.EndUpdate()
|
||||
|
||||
AddHandler ListView.RequestEmbeddedControl, AddressOf ListViewRequestEmbeddedControl
|
||||
|
||||
End Sub
|
||||
|
||||
Private Function ListViewRequestEmbeddedControl(ByVal sender As Object,
|
||||
ByVal eventArgs As BetterListViewRequestEmbeddedControlEventArgs) _
|
||||
As IBetterListViewEmbeddedControl
|
||||
|
||||
If eventArgs.SubItem.Index = 1 Then
|
||||
Return (New DocumentAccessConrol())
|
||||
End If
|
||||
|
||||
Return Nothing
|
||||
|
||||
End Function
|
||||
|
||||
End Class</code></pre>
|
||||
|
||||
<p><span class="code">DocumentAccessControl</span> class used as complex embedded
|
||||
control (see <span class="code">EmbeddedControlSampleForm</span> sample in the provided
|
||||
C# and Visual Basic samples for full source code):</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">/// <summary>
|
||||
/// Represents a custom control embeddable in Better ListView.
|
||||
/// </summary>
|
||||
[ToolboxItem(false)]
|
||||
internal sealed partial class DocumentAccessConrol : UserControl, IBetterListViewEmbeddedControl
|
||||
{
|
||||
private const string StringRead = "read";
|
||||
private const string StringWrite = "write";
|
||||
|
||||
/// <summary>
|
||||
/// current (edited) label text
|
||||
/// </summary>
|
||||
public string LabelText
|
||||
{
|
||||
get
|
||||
{
|
||||
// convert control's state to label
|
||||
if (this.checkBoxRead.Checked &&
|
||||
this.checkBoxWrite.Checked)
|
||||
{
|
||||
return String.Format("{0} {1}", StringRead, StringWrite);
|
||||
}
|
||||
|
||||
if (this.checkBoxRead.Checked)
|
||||
{
|
||||
return StringRead;
|
||||
}
|
||||
|
||||
if (this.checkBoxWrite.Checked)
|
||||
{
|
||||
return StringWrite;
|
||||
}
|
||||
|
||||
return String.Empty;
|
||||
}
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// request accepting updated data in BetterListView
|
||||
/// </summary>
|
||||
public event EventHandler RequestAccept;
|
||||
|
||||
/// <summary>
|
||||
/// request cancelling editing
|
||||
/// </summary>
|
||||
public event EventHandler RequestCancel;
|
||||
|
||||
/// <summary>
|
||||
/// Initializes a new instance of the <see cref = "DocumentAccessConrol" /> class.
|
||||
/// </summary>
|
||||
public DocumentAccessConrol()
|
||||
{
|
||||
InitializeComponent();
|
||||
|
||||
//NOTE: disabling validation prevents form close cancellation
|
||||
CausesValidation = false;
|
||||
|
||||
foreach (Control control in Controls)
|
||||
{
|
||||
control.LostFocus += ControlOnLostFocus;
|
||||
}
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// get data from the specified sub-item in control
|
||||
/// </summary>
|
||||
/// <param name = "subItem">sub-item whose data are being edited</param>
|
||||
public void GetData(BetterListViewSubItem subItem)
|
||||
{
|
||||
// convert label to control's state
|
||||
this.checkBoxRead.Checked = subItem.Text.Contains(StringRead);
|
||||
this.checkBoxWrite.Checked = subItem.Text.Contains(StringWrite);
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// set data from control to the specified sub-item
|
||||
/// </summary>
|
||||
/// <param name = "subItem">sub-item whose data are being edited</param>
|
||||
public void SetData(BetterListViewSubItem subItem)
|
||||
{
|
||||
subItem.Text = LabelText;
|
||||
}
|
||||
|
||||
/// <summary>
|
||||
/// set control size
|
||||
/// </summary>
|
||||
/// <param name = "subItem">sub-item whose data are being edited</param>
|
||||
/// <param name = "placement">placement of the embedded control within sub-item</param>
|
||||
public void SetSize(BetterListViewSubItem subItem, BetterListViewEmbeddedControlPlacement placement)
|
||||
{
|
||||
// keep size of the control unchanged
|
||||
}
|
||||
|
||||
private void ControlOnLostFocus(object sender, EventArgs eventArgs)
|
||||
{
|
||||
//
|
||||
// NOTE: this code is needed just for hiding embedded control with sub-controls when user changes active form while label editing
|
||||
//
|
||||
bool anyFocused = Focused;
|
||||
|
||||
if (anyFocused == false)
|
||||
{
|
||||
foreach (Control control in Controls)
|
||||
{
|
||||
if (control.Focused)
|
||||
{
|
||||
anyFocused = true;
|
||||
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (anyFocused == false)
|
||||
{
|
||||
RequestAccept(this, eventArgs);
|
||||
}
|
||||
}
|
||||
|
||||
private void ButtonOKClick(object sender, EventArgs e)
|
||||
{
|
||||
RequestAccept(this, e);
|
||||
}
|
||||
|
||||
private void ButtonCancelClick(object sender, EventArgs e)
|
||||
{
|
||||
RequestCancel(this, e);
|
||||
}
|
||||
}</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">''' <summary>
|
||||
''' Represents a custom control embeddable in Better ListView.
|
||||
''' </summary>
|
||||
<ToolboxItem(False)>
|
||||
Partial Friend NotInheritable Class DocumentAccessConrol
|
||||
Inherits UserControl
|
||||
Implements IBetterListViewEmbeddedControl
|
||||
|
||||
Private Const StringRead As String = "read"
|
||||
Private Const StringWrite As String = "write"
|
||||
|
||||
''' <summary>
|
||||
''' current (edited) label text
|
||||
''' </summary>
|
||||
Public ReadOnly Property LabelText() As String Implements IBetterListViewEmbeddedControl.LabelText
|
||||
Get
|
||||
' convert control's state to label
|
||||
If CheckBoxRead.Checked AndAlso CheckBoxWrite.Checked Then
|
||||
Return [String].Format("{0} {1}", StringRead, StringWrite)
|
||||
End If
|
||||
|
||||
If CheckBoxRead.Checked Then
|
||||
Return StringRead
|
||||
End If
|
||||
|
||||
If CheckBoxWrite.Checked Then
|
||||
Return StringWrite
|
||||
End If
|
||||
|
||||
Return [String].Empty
|
||||
End Get
|
||||
End Property
|
||||
|
||||
''' <summary>
|
||||
''' request accepting updated data in BetterListView
|
||||
''' </summary>
|
||||
Public Event RequestAccept As EventHandler Implements IBetterListViewEmbeddedControl.RequestAccept
|
||||
|
||||
''' <summary>
|
||||
''' request cancelling editing
|
||||
''' </summary>
|
||||
Public Event RequestCancel As EventHandler Implements IBetterListViewEmbeddedControl.RequestCancel
|
||||
|
||||
''' <summary>
|
||||
''' Initializes a new instance of the <see cref = "DocumentAccessConrol" /> class.
|
||||
''' </summary>
|
||||
Public Sub New()
|
||||
|
||||
InitializeComponent()
|
||||
|
||||
'NOTE: disabling validation prevents form close cancellation
|
||||
CausesValidation = False
|
||||
|
||||
For Each control As Control In Controls
|
||||
AddHandler control.LostFocus, AddressOf ControlOnLostFocus
|
||||
Next
|
||||
|
||||
End Sub
|
||||
|
||||
''' <summary>
|
||||
''' get data from the specified sub-item in control
|
||||
''' </summary>
|
||||
''' <param name = "subItem">sub-item whose data are being edited</param>
|
||||
Public Sub GetData(ByVal subItem As BetterListViewSubItem) Implements IBetterListViewEmbeddedControl.GetData
|
||||
|
||||
' convert label to control's state
|
||||
CheckBoxRead.Checked = subItem.Text.Contains(StringRead)
|
||||
CheckBoxWrite.Checked = subItem.Text.Contains(StringWrite)
|
||||
|
||||
End Sub
|
||||
|
||||
''' <summary>
|
||||
''' set data from control to the specified sub-item
|
||||
''' </summary>
|
||||
''' <param name = "subItem">sub-item whose data are being edited</param>
|
||||
Public Sub SetData(ByVal subItem As BetterListViewSubItem) Implements IBetterListViewEmbeddedControl.SetData
|
||||
|
||||
subItem.Text = LabelText
|
||||
|
||||
End Sub
|
||||
|
||||
''' <summary>
|
||||
''' set control size
|
||||
''' </summary>
|
||||
''' <param name = "subItem">sub-item whose data are being edited</param>
|
||||
''' <param name = "placement">placement of the embedded control within sub-item</param>
|
||||
Public Sub SetSize(ByVal subItem As BetterListViewSubItem,
|
||||
ByVal placement As BetterListViewEmbeddedControlPlacement) _
|
||||
Implements IBetterListViewEmbeddedControl.SetSize
|
||||
|
||||
' keep size of the control unchanged
|
||||
|
||||
End Sub
|
||||
|
||||
Private Sub ControlOnLostFocus(ByVal sender As Object, ByVal eventArgs As EventArgs)
|
||||
|
||||
'
|
||||
' NOTE: this code is needed just for hiding embedded control with sub-controls when user changes active form while label editing
|
||||
'
|
||||
Dim anyFocused As Boolean = Focused
|
||||
|
||||
If anyFocused = False Then
|
||||
For Each control As Control In Controls
|
||||
If control.Focused Then
|
||||
anyFocused = True
|
||||
|
||||
Exit For
|
||||
End If
|
||||
Next
|
||||
End If
|
||||
|
||||
If anyFocused = False Then
|
||||
RaiseEvent RequestAccept(Me, eventArgs)
|
||||
End If
|
||||
|
||||
End Sub
|
||||
|
||||
Private Sub ButtonOKClick(ByVal sender As Object, ByVal e As EventArgs) Handles ButtonOK.Click
|
||||
RaiseEvent RequestAccept(Me, e)
|
||||
End Sub
|
||||
|
||||
Private Sub ButtonCancelClick(ByVal sender As Object, ByVal e As EventArgs) Handles ButtonCancel.Click
|
||||
RaiseEvent RequestCancel(Me, e)
|
||||
End Sub
|
||||
|
||||
End Class</code></pre>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-drag-drop.html"><strong>
|
||||
« Drag and Drop</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-empty-text.html"><strong>Empty Text »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,110 @@
|
||||
<!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>Empty Text</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-embedded-controls.html"><strong>
|
||||
« Embedded Controls</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-focus.html"><strong>Focusing Elements »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Empty Text</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<br><hr>
|
||||
<p class="note">Empty text feature is not supported in <strong><em>Better ListView
|
||||
Express</em></strong>.</p>
|
||||
<hr>
|
||||
<br><p>This feature displays text when Better ListView is empty (does not
|
||||
contain any items and groups).</p>
|
||||
|
||||
<p>A typical use case is file browser, showing "This folder is empty."
|
||||
text when there are no files to display.</p>
|
||||
|
||||
<p>Better ListView can display such arbitrary text with custom font and
|
||||
color.</p>
|
||||
|
||||
<p>The text can be of multiple lines and is automatically trimmed if
|
||||
there is not enough space.</p>
|
||||
|
||||
<p class="images"><img src="empty-text.png"></p>
|
||||
|
||||
<p>To add an empty text, simply set the <span class="code">EmptyText</span> property
|
||||
value. You can simply pass a value of type <span class="code">String</span> (there is an
|
||||
implicit conversion defined) or <span class="code">BetterListViewEmptyText</span> (which
|
||||
allows for settings custom font and color).</p>
|
||||
|
||||
<p>An explicit conversion of <span class="code">BetterListViewEmptyText</span> to
|
||||
<span class="code">String</span> is also defined.</p>
|
||||
|
||||
<h2>Sample Source Code</h2>
|
||||
|
||||
|
||||
<p>This minimalist sample shows how to easily set an empty text with
|
||||
default style:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">this.listView.EmptyText = "Text displayed on empty list.";</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">ListView.EmptyText = "Text displayed on empty list."</code></pre>
|
||||
|
||||
<p>This sample show setting empty text with custom font and
|
||||
color:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">// set empty text with custom style
|
||||
this.listView.EmptyText = new BetterListViewEmptyText(
|
||||
"Text displayed on empty list.",
|
||||
new Font("Arial", 12.0f, FontStyle.Bold | FontStyle.Italic),
|
||||
Color.DarkBlue);</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">' set empty text with custom style
|
||||
ListView.EmptyText = New BetterListViewEmptyText (
|
||||
"Text displayed on empty list.",
|
||||
New Font ("Arial", 12.0F, FontStyle.Bold Or FontStyle.Italic),
|
||||
Color.DarkBlue)</code></pre>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-embedded-controls.html"><strong>
|
||||
« Embedded Controls</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-focus.html"><strong>Focusing Elements »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,120 @@
|
||||
<!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>Focusing Elements</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-empty-text.html"><strong>
|
||||
« Empty Text</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-groups.html"><strong>Groups »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Focusing Elements</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<h2>Focusing Items and Groups</h2>
|
||||
|
||||
|
||||
<p>Elements of Better ListView controls can be focused independently on
|
||||
control focus state. Items, sub-items and groups can be focused using
|
||||
mouse or keyboard.</p>
|
||||
|
||||
<p>When item or group is clicked, it gets focus within the Better
|
||||
ListView Control. The focused item is usually displayed slightly darker
|
||||
than other items (Aero theme) when selected.</p>
|
||||
|
||||
<p>The focused item can be recognized by <strong><em>focus
|
||||
rectangle</em></strong>, which is apparent when item is focused, but not
|
||||
selected:</p>
|
||||
|
||||
<p class="images"><img src="focus-item.png"><img src="focus-group.png"></p>
|
||||
|
||||
<p>When graphic theme is turned off, focus rectangle is displayed after
|
||||
item or group is focused by keyboard for the first time. To hide focus
|
||||
rectangle again, call <span class="code">ResetFocusRectangleDisplay</span>
|
||||
method.</p>
|
||||
|
||||
|
||||
<h2>Focusing Sub-Items</h2>
|
||||
|
||||
|
||||
<p>Sub-items can be focused in <strong><em>Details</em></strong> view with
|
||||
columns.</p>
|
||||
|
||||
<p>Sub-items cannot be focused by mouse, but when an item is focused,
|
||||
using <span class="code">Left</span> and <span class="code">Right</span> arrow keys allows you to
|
||||
move focus rectangle to subsequent sub-items:</p>
|
||||
|
||||
<p class="images"><img src="sub-items.png"></p>
|
||||
|
||||
<p>Having a sub-item focused allows you to invoke label editing of
|
||||
sub-items using keyboard (see <strong><em><a href="chapter-label-edit.html">Label Editing</a></em></strong> for more
|
||||
information).</p>
|
||||
|
||||
|
||||
<h2>Detecting Focused Element</h2>
|
||||
|
||||
|
||||
<p>Better ListView provides several properties to check which element
|
||||
is currently focused:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">FocusedGroup</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">FocusedItem</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">FocusedSubItem</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<br><hr>
|
||||
<p class="note">When a sub-item is focused (<span class="code">FocusedSubItem</span> property
|
||||
is not <span class="code">null</span>), the item is focused as well.</p>
|
||||
<hr>
|
||||
<br><p>To detect when focused element has been change, use the
|
||||
<span class="code">FocusedItemChanged</span> event. Event data contains information
|
||||
about both previous and recent focused element.</p>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-empty-text.html"><strong>
|
||||
« Empty Text</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-groups.html"><strong>Groups »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,333 @@
|
||||
<!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>Groups</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-focus.html"><strong>
|
||||
« Focusing Elements</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-hit-test.html"><strong>Hit Test »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Groups</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<p>Groups allow items to be organized into subsets.</p>
|
||||
|
||||
<p>Depending on the view, groups can be oriented vertically or
|
||||
horizontally. Following screenshot shows items organized into groups:</p>
|
||||
|
||||
<p class="images"><img src="groups-overview-vertical.png"><img src="groups-overview-horizontal.png"></p>
|
||||
|
||||
<h2>Setting Up Groups</h2>
|
||||
|
||||
|
||||
<p>By default, groups are not visible and there is only one
|
||||
<strong><em>default</em></strong> group with all the items.</p>
|
||||
|
||||
<p>Setting-up groups is very simple. Just set the
|
||||
<span class="code">ShowGroups</span> property to <span class="code">true</span>.</p>
|
||||
|
||||
<p>Adding and managing custom groups can be done through
|
||||
<span class="code">Groups</span> collection in the same manner as when managing columns
|
||||
and items.</p>
|
||||
|
||||
<p>The last step when setting-up groups is to put items into their
|
||||
groups. This can be done either by setting group on
|
||||
<span class="code">BetterListViewItem</span> instance:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">item.Group = group;</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">item.Group = group</code></pre>
|
||||
|
||||
<p>or by adding the item into <span class="code">BetterListViewGroup.Items</span>
|
||||
collection:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">group.Items.Add(item);</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">group.Items.Add(item)</code></pre>
|
||||
|
||||
<p>We chose to use the similar data model for groups as used in the
|
||||
regular .NET ListView, so the usage is virtually the same. The only
|
||||
difference is that Better ListView keeps order of items within groups.
|
||||
Even thought we adopt the .NET ListView model, it would be convenient to
|
||||
pinpoint important aspects of groups:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p>Items without group are displayed in
|
||||
<strong><em>default</em></strong> group.</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>The <strong><em>default</em></strong> group is just a placeholder for
|
||||
items and not intented to be edited; simply create a custom group for
|
||||
such purpose.</p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewGroup.Items</span> collection can contain
|
||||
items that are not part of the current control - only items that are
|
||||
part of both the control and the group within that control are
|
||||
displayed.</p>
|
||||
</li>
|
||||
</ul>
|
||||
<h2>Selecting Groups</h2>
|
||||
|
||||
|
||||
<p>Only items contribute to selections in ListView. However, groups are
|
||||
interactive and support item selections. When a group is collapsed (left
|
||||
image), it behaves like item. Such group can be selected by keyboard, by
|
||||
clicking on it or even with mouse drag selection. When a group is expanded
|
||||
(right image), it does not appear as selected, but in both cases the group
|
||||
"selection" means that all items within that group are selected.</p>
|
||||
|
||||
<p class="images"><img src="groups-selected1.png"><img src="groups-selected2.png"></p>
|
||||
|
||||
<p>Groups can be focused just like items. When a group is focused, a
|
||||
focus rectangle appears on the group and the currently focused group can
|
||||
be retrieved by <span class="code">FocusedGroup</span> property.</p>
|
||||
|
||||
|
||||
<h2>Adjusting Group Header Behavior</h2>
|
||||
|
||||
|
||||
<p>The group headers can be focused and perform selection of items with
|
||||
both keyboard and mouse. This behavior can be altered using
|
||||
<span class="code">GroupHeaderBehavior</span> property, which is a flag enumeration
|
||||
with following values:</p>
|
||||
|
||||
<ul style="list-style:none">
|
||||
<li>
|
||||
<span class="code">None</span><ul style="list-style:none"><li>
|
||||
<p>The group header is only displayed, not interactive.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">KeyboardFocus</span><ul style="list-style:none"><li>
|
||||
<p>The group header can be focused with keyboard.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">KeyboardSelectAndFocus</span><ul style="list-style:none"><li>
|
||||
<p>The group header can be focused and provides selection of
|
||||
items width keyboard. This value implicates
|
||||
<span class="code">KeyboardFocus</span>.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">MouseFocus</span><ul style="list-style:none"><li>
|
||||
<p>The group header can be focused with mouse.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">MouseHighlight</span><ul style="list-style:none"><li>
|
||||
<p>The group header is highlighted when mouse cursor hovers over
|
||||
it.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">MouseSelect</span><ul style="list-style:none"><li>
|
||||
<p>The group header provides selection of items with
|
||||
mouse.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">All</span><ul style="list-style:none"><li>
|
||||
<p>The group header is fully interactive (all the options above
|
||||
are active).</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
</ul>
|
||||
<h2>Expandable Groups</h2>
|
||||
|
||||
|
||||
<br><hr>
|
||||
<p class="note">Expandable groups are not supported in <strong><em>Better ListView
|
||||
Express</em></strong>.</p>
|
||||
<hr>
|
||||
<br><p>In all views except <strong><em>List</em></strong>, the groups are
|
||||
oriented vertically and can be collapsed and expanded through expand
|
||||
button.</p>
|
||||
|
||||
<p>Groups are expandable by default, but expand buttons can be turned
|
||||
off by settings <span class="code">ShowGroupExpandButtons</span> to <span class="code">false</span>.
|
||||
If you want to hide expand button on selected groups only, set
|
||||
<span class="code">BetterListViewGroup.AllowShowExpandButton</span> to
|
||||
<span class="code">false</span>.</p>
|
||||
|
||||
<p>Group can be expanded or collapsed programmatically using
|
||||
<span class="code">BetterListViewGroup.IsExpanded</span> property.</p>
|
||||
|
||||
|
||||
<h2>Hiding the Default Group Header</h2>
|
||||
|
||||
|
||||
<p>The default group header is visible by default, but can be hidden by
|
||||
setting <span class="code">ShowDefaultGroupHeader</span> property to
|
||||
<span class="code">false</span>:</p>
|
||||
|
||||
<p class="images"><img src="groups-showdefault1.png"><img src="groups-showdefault2.png"></p>
|
||||
|
||||
|
||||
<h2>Sample Source Code</h2>
|
||||
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">//
|
||||
// create first group
|
||||
//
|
||||
BetterListViewGroup groupUnread = new BetterListViewGroup("Unread Messages");
|
||||
|
||||
// add items to the first group
|
||||
groupUnread.Items.AddRange(
|
||||
new[]
|
||||
{
|
||||
"Hello, Dave",
|
||||
"Suggestion about your software",
|
||||
"You won the 1st prize!"
|
||||
});
|
||||
|
||||
//
|
||||
// create second group
|
||||
//
|
||||
BetterListViewGroup groupRead = new BetterListViewGroup("Read Messages");
|
||||
|
||||
// add items to the second group
|
||||
groupRead.Items.AddRange(
|
||||
new[]
|
||||
{
|
||||
"Weekly meeting in a pub",
|
||||
"You won the 1st prize!"
|
||||
});
|
||||
|
||||
//
|
||||
// create third group
|
||||
//
|
||||
BetterListViewGroup groupConcepts = new BetterListViewGroup("Concepts");
|
||||
|
||||
// setup style of the first group
|
||||
groupConcepts.Font = new Font(
|
||||
"Arial",
|
||||
groupConcepts.Font.Size,
|
||||
FontStyle.Italic);
|
||||
|
||||
groupConcepts.ForeColor = Color.Gray;
|
||||
|
||||
// add items to the third group
|
||||
groupConcepts.Items.AddRange(
|
||||
new[]
|
||||
{
|
||||
"How are you, Pete?"
|
||||
});
|
||||
|
||||
//
|
||||
// setup Better ListView
|
||||
//
|
||||
this.listView.BeginUpdate();
|
||||
|
||||
// add groups with items to the list
|
||||
this.listView.Groups.AddRange(
|
||||
new[]
|
||||
{
|
||||
groupUnread,
|
||||
groupRead,
|
||||
groupConcepts
|
||||
});
|
||||
|
||||
// size items with the content area (optional)
|
||||
this.listView.AutoSizeItemsInDetailsView = true;
|
||||
// show not only items, but the groups as well
|
||||
this.listView.ShowGroups = true;
|
||||
|
||||
this.listView.EndUpdate();</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">'
|
||||
' create first group
|
||||
'
|
||||
Dim groupUnread As New BetterListViewGroup ("Unread Messages")
|
||||
|
||||
' add items to the first group
|
||||
groupUnread.Items.AddRange (New String() _
|
||||
{"Hello, Dave", "Suggestion about your software", "You won the 1st prize!"})
|
||||
|
||||
'
|
||||
' create second group
|
||||
'
|
||||
Dim groupRead As New BetterListViewGroup ("Read Messages")
|
||||
|
||||
' add items to the second group
|
||||
groupRead.Items.AddRange (New String() {"Weekly meeting in a pub", "You won the 1st prize!"})
|
||||
|
||||
'
|
||||
' create third group
|
||||
'
|
||||
Dim groupConcepts As New BetterListViewGroup ("Concepts")
|
||||
|
||||
' setup style of the first group
|
||||
groupConcepts.Font = New Font ("Arial", groupConcepts.Font.Size, FontStyle.Italic)
|
||||
|
||||
groupConcepts.ForeColor = Color.Gray
|
||||
|
||||
' add items to the third group
|
||||
groupConcepts.Items.AddRange (New String() {"How are you, Pete?"})
|
||||
|
||||
'
|
||||
' setup Better ListView
|
||||
'
|
||||
ListView.BeginUpdate()
|
||||
|
||||
' add groups with items to the list
|
||||
ListView.Groups.AddRange (New BetterListViewGroup() {groupUnread, groupRead, groupConcepts})
|
||||
|
||||
' size items with the content area (optional)
|
||||
ListView.AutoSizeItemsInDetailsView = True
|
||||
' show not only items, but the groups as well
|
||||
ListView.ShowGroups = True
|
||||
|
||||
ListView.EndUpdate()</code></pre>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-focus.html"><strong>
|
||||
« Focusing Elements</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-hit-test.html"><strong>Hit Test »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,234 @@
|
||||
<!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>Hit Test</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-groups.html"><strong>
|
||||
« Groups</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-insertion-mark.html"><strong>Insertion Mark »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Hit Test</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<p>Hit test allows you to detect elements and element parts for a
|
||||
specified position in the control. There are two overrides of the HitTest
|
||||
method:</p>
|
||||
|
||||
<ul style="list-style:none">
|
||||
<li>
|
||||
<span class="code">HitTest()</span><ul style="list-style:none"><li>
|
||||
<p>Returns hit test information for the current mouse
|
||||
position.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">HitTest(Point)</span><ul style="list-style:none"><li>
|
||||
<p>Returns hit test information for the specified position (in
|
||||
client coordinates).</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
</ul>
|
||||
<p>The returned structure <span class="code">BetterListViewHitTestInfo</span> contains
|
||||
references to Better ListView elements (column, group, item, sub-item),
|
||||
element parts and even its state information.</p>
|
||||
|
||||
<p>Current hit test information changes every time user moves mouse from
|
||||
one element part to another (or to another element), or when state of the
|
||||
hovered element changes (e.g. column is pressed). Better ListView raises
|
||||
<span class="code">BetterListViewHitTestChanged</span> event whenever this occurs.</p>
|
||||
|
||||
<h2>BetterListViewHitTestInfo.Locations Property</h2>
|
||||
|
||||
|
||||
<p>Furthermore, this structure contains a <span class="code">Locations</span>
|
||||
property, which is enumeration with flags of all the cursor locations. Of
|
||||
course, there is always just a single cursor position, but it can
|
||||
correspond to multiple locations. For example, when the mouse cursor is
|
||||
hovers over an item text, the <span class="code">Locations</span> property has the
|
||||
following value:</p>
|
||||
|
||||
<p></p>
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">BetterListViewHitTestLocations.ContentArea | BetterListViewHitTestLocations.Item | BetterListViewHitTestLocations.ItemSelection | BetterListViewHitTestLocations.ItemText</code></pre>
|
||||
|
||||
<p></p>
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">BetterListViewHitTestLocations.ContentArea Or BetterListViewHitTestLocations.Item Or BetterListViewHitTestLocations.ItemSelection Or BetterListViewHitTestLocations.ItemText</code></pre>
|
||||
|
||||
<p>When the mouse cursor is inside the control, the
|
||||
<span class="code">Locations</span> property has always the <span class="code">ContentArea</span>
|
||||
flag on. The same rule applies within Better ListView elements.</p>
|
||||
|
||||
<p>To check for some specific location (e.g. expand button of a group),
|
||||
write the following expression in an <strong><em>if</em></strong>
|
||||
statement:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">(hitTestInfo.Locations & BetterListViewHitTestLocations.GroupExpandButton) == BetterListViewHitTestLocations.GroupExpandButton</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">(hitTestInfo.Locations And BetterListViewHitTestLocations.GroupExpandButton) = BetterListViewHitTestLocations.GroupExpandButton</code></pre>
|
||||
|
||||
|
||||
<h2>Difference between ItemDisplay and ItemSelection</h2>
|
||||
|
||||
|
||||
<p>There are two items returned by hit test, which are not necessarily
|
||||
the same: <span class="code">BetterListViewHitTestInfo.ItemDisplay</span> and
|
||||
<span class="code">BetterListViewHitTestInfo.ItemSelection</span>.</p>
|
||||
|
||||
<p>These two items differ when combined items are turned on (see <strong><em><a href="chapter-select-check.html#combined-items">Combined
|
||||
Items</a></em></strong> for more information).</p>
|
||||
|
||||
<p>The <span class="code">ItemDisplay</span> property always refers to the displayed
|
||||
item under cursor regardless of combined items. The
|
||||
<span class="code">ItemSelection</span> property refers to corresponding selectable
|
||||
item.</p>
|
||||
|
||||
|
||||
<h2>Sample Source Code</h2>
|
||||
|
||||
|
||||
<p>The following sample shows handler of
|
||||
<span class="code">BetterListViewHitTestChanged</span> event setting comprehensive
|
||||
information about hit test in a <span class="code">TextBox</span>:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">private void ListViewHitTestChanged(object sender, BetterListViewHitTestChangedEventArgs eventArgs)
|
||||
{
|
||||
BetterListViewHitTestInfo hitTestInfo = eventArgs.HitTestInfoNew;
|
||||
StringBuilder sbHitTest = new StringBuilder();
|
||||
|
||||
sbHitTest.AppendLine(String.Format("Locations: {0}", hitTestInfo.Locations));
|
||||
|
||||
if ((hitTestInfo.Locations & BetterListViewHitTestLocations.ColumnHeader) == BetterListViewHitTestLocations.ColumnHeader)
|
||||
{
|
||||
sbHitTest.AppendLine();
|
||||
sbHitTest.AppendLine(String.Format("Column header: '{0}'", hitTestInfo.ColumnHeader.Text));
|
||||
sbHitTest.AppendLine(String.Format("Column header part: {0}", hitTestInfo.ColumnHeaderPart));
|
||||
sbHitTest.AppendLine(String.Format("Column header state: {0}", hitTestInfo.ColumnHeaderStateInfo.ColumnHeaderState));
|
||||
}
|
||||
|
||||
if ((hitTestInfo.Locations & BetterListViewHitTestLocations.Group) == BetterListViewHitTestLocations.Group)
|
||||
{
|
||||
sbHitTest.AppendLine();
|
||||
sbHitTest.AppendLine(String.Format("Group: '{0}'", hitTestInfo.Group.Header));
|
||||
sbHitTest.AppendLine(String.Format("Group part: {0}", hitTestInfo.GroupPart));
|
||||
sbHitTest.AppendLine(String.Format("Group state: {0}", hitTestInfo.GroupStateInfo.GroupState));
|
||||
sbHitTest.AppendLine(String.Format("Group expand button state: {0}", hitTestInfo.GroupStateInfo.ExpandButtonState));
|
||||
}
|
||||
|
||||
if ((hitTestInfo.Locations & BetterListViewHitTestLocations.Item) == BetterListViewHitTestLocations.Item)
|
||||
{
|
||||
sbHitTest.AppendLine();
|
||||
sbHitTest.AppendLine(String.Format("Item: '{0}'", hitTestInfo.ItemDisplay.Text));
|
||||
sbHitTest.AppendLine(String.Format("Item part: {0}", hitTestInfo.ItemPartDisplay));
|
||||
sbHitTest.AppendLine(String.Format("Item state: {0}", hitTestInfo.ItemStateInfo.ItemState));
|
||||
}
|
||||
|
||||
if ((hitTestInfo.Locations & BetterListViewHitTestLocations.SubItem) == BetterListViewHitTestLocations.SubItem)
|
||||
{
|
||||
sbHitTest.AppendLine();
|
||||
sbHitTest.AppendLine(String.Format("Sub-item: '{0}'", hitTestInfo.SubItem.Text));
|
||||
sbHitTest.AppendLine(String.Format("Sub-item part: {0}", hitTestInfo.SubItemPart));
|
||||
}
|
||||
|
||||
this.textBoxHitTest.Text = sbHitTest.ToString();
|
||||
}</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">Private Sub ListViewHitTestChanged (ByVal sender As Object, ByVal eventArgs As BetterListViewHitTestChangedEventArgs)
|
||||
|
||||
Dim hitTestInfo As BetterListViewHitTestInfo = eventArgs.HitTestInfoNew
|
||||
Dim sbHitTest As New StringBuilder()
|
||||
|
||||
sbHitTest.AppendLine ([String].Format ("Locations: {0}", hitTestInfo.Locations))
|
||||
|
||||
If _
|
||||
(hitTestInfo.Locations And BetterListViewHitTestLocations.ColumnHeader) =
|
||||
BetterListViewHitTestLocations.ColumnHeader Then
|
||||
|
||||
sbHitTest.AppendLine()
|
||||
sbHitTest.AppendLine ([String].Format ("Column header: '{0}'", hitTestInfo.ColumnHeader.Text))
|
||||
sbHitTest.AppendLine ([String].Format ("Column header part: {0}", hitTestInfo.ColumnHeaderPart))
|
||||
sbHitTest.AppendLine ([String].Format ("Column header state: {0}",
|
||||
hitTestInfo.ColumnHeaderStateInfo.ColumnHeaderState))
|
||||
|
||||
End If
|
||||
|
||||
If (hitTestInfo.Locations And BetterListViewHitTestLocations.Group) = BetterListViewHitTestLocations.Group Then
|
||||
|
||||
sbHitTest.AppendLine()
|
||||
sbHitTest.AppendLine ([String].Format ("Group: '{0}'", hitTestInfo.Group.Header))
|
||||
sbHitTest.AppendLine ([String].Format ("Group part: {0}", hitTestInfo.GroupPart))
|
||||
sbHitTest.AppendLine ([String].Format ("Group state: {0}", hitTestInfo.GroupStateInfo.GroupState))
|
||||
sbHitTest.AppendLine ([String].Format ("Group expand button state: {0}",
|
||||
hitTestInfo.GroupStateInfo.ExpandButtonState))
|
||||
|
||||
End If
|
||||
|
||||
If (hitTestInfo.Locations And BetterListViewHitTestLocations.Item) = BetterListViewHitTestLocations.Item Then
|
||||
|
||||
sbHitTest.AppendLine()
|
||||
sbHitTest.AppendLine ([String].Format ("Item: '{0}'", hitTestInfo.ItemDisplay.Text))
|
||||
sbHitTest.AppendLine ([String].Format ("Item part: {0}", hitTestInfo.ItemPartDisplay))
|
||||
sbHitTest.AppendLine ([String].Format ("Item state: {0}", hitTestInfo.ItemStateInfo.ItemState))
|
||||
|
||||
End If
|
||||
|
||||
If (hitTestInfo.Locations And BetterListViewHitTestLocations.SubItem) = BetterListViewHitTestLocations.SubItem _
|
||||
Then
|
||||
|
||||
sbHitTest.AppendLine()
|
||||
sbHitTest.AppendLine ([String].Format ("Sub-item: '{0}'", hitTestInfo.SubItem.Text))
|
||||
sbHitTest.AppendLine ([String].Format ("Sub-item part: {0}", hitTestInfo.SubItemPart))
|
||||
|
||||
End If
|
||||
|
||||
TextBoxHitTest.Text = sbHitTest.ToString()
|
||||
|
||||
End Sub</code></pre>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-groups.html"><strong>
|
||||
« Groups</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-insertion-mark.html"><strong>Insertion Mark »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,361 @@
|
||||
<!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>Insertion Mark</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-hit-test.html"><strong>
|
||||
« Hit Test</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-item-hierarchy.html"><strong>Item Hierarchy »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Insertion Mark</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<br><hr>
|
||||
<p class="note"><strong><em>Better ListView Express</em></strong> does not support groups
|
||||
or hierarchical items, so the insertion mark can be placed on items only
|
||||
in the <strong><em>Express</em></strong> edition.</p>
|
||||
<hr>
|
||||
<br><p>Insertion mark is a line showing location between items. Better
|
||||
ListView support displaying the insertion mark on various locations with
|
||||
support for groups and item hierarchy:</p>
|
||||
|
||||
<p class="images"><img src="insertion-mark-hierarchy1.png"><img src="insertion-mark-hierarchy2.png"><img src="insertion-mark-hierarchy3.png"><img src="insertion-mark-vertical.png"></p>
|
||||
|
||||
<p>The basic usage of insertion mark is the same as in regular .NET
|
||||
ListView. Setting <span class="code">InsertionMark</span> property using one of these
|
||||
constructors will give you the <strong><em>classic</em></strong> insertion
|
||||
mark:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewInsertionMark(int index)</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewInsertionMark(int index, bool
|
||||
showAfterItem)</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewInsertionMark(int index, bool showAfterItem,
|
||||
Color color)</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewInsertionMark(int index, bool showAfterItem,
|
||||
Color color, bool enabled)</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>The last constructor has an extra parameter <span class="code">enabled</span> which
|
||||
adjusts insertion mark color slightly (giving it alpha transparency) to be
|
||||
displayed in an <strong><em>inactive</em></strong> or
|
||||
<strong><em>disabled</em></strong> state.</p>
|
||||
|
||||
<p>There are also more general constructors for displaying insertion mark
|
||||
on arbitrary location in item hierarchy and on groups:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewInsertionMark(BetterListViewInsertionLocation
|
||||
insertionLocation)</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewInsertionMark(BetterListViewInsertionLocation
|
||||
insertionLocation, Color color)</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewInsertionMark(BetterListViewInsertionLocation
|
||||
insertionLocation, Color color, bool enabled)</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>Instead of <span class="code">index</span>, there is an
|
||||
<span class="code">insertionLocation</span> parameter.</p>
|
||||
|
||||
<h2>Insertion Locations</h2>
|
||||
|
||||
|
||||
<p>The <span class="code">BetterListViewInsertionLocation</span> type can describe
|
||||
any location in item hierarchy and on groups. The location consists of
|
||||
three properties:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">Address</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">DropPart</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">Level</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<p><span class="code">Address</span> is a counterpart of index in item hierarchy
|
||||
(see <strong><em><a href="chapter-item-hierarchy.html#addressing-elements">Addressing
|
||||
Elements</a></em></strong>). It can describe either group or a child item.</p>
|
||||
|
||||
<p><span class="code">DropPart</span> defines relative insertion location to the
|
||||
element specified by the <span class="code">Address</span>. The drop part value can be
|
||||
either <span class="code">Before</span> the element, <span class="code">After</span> the element or
|
||||
<span class="code">Inside</span> the element. For groups, the <span class="code">Inside</span> is
|
||||
the only valid value. Items can display any of the three drop parts. The
|
||||
difference between <span class="code">After</span> and <span class="code">Inside</span> is that with
|
||||
<span class="code">Inside</span> it is possible to create new child items. Otherwise,
|
||||
the location <strong><em>inside item</em></strong> can be substituted by
|
||||
<strong><em>before first child item of that item</em></strong>.</p>
|
||||
|
||||
<p><span class="code">Level</span> specifies target level in item hierarchy. It is
|
||||
valid for <span class="code">Before</span> and <span class="code">After</span> drop parts only. By
|
||||
default, the <span class="code">Level</span> property has value of
|
||||
<span class="code">BetterListViewInsertionLocation.LevelUndefined</span> and thus
|
||||
inheriting level of the currently located item. When set, it overrides the
|
||||
level and the insertion mark can start on smaller offset than the child
|
||||
item. This is used mainly internally for item reordering, when user puts
|
||||
item after the last child item and then moves mouse cursor to the left, to
|
||||
put it after its parent, actually.</p>
|
||||
|
||||
|
||||
<h2>Sample Source Code</h2>
|
||||
|
||||
|
||||
<p>The following sample shows how to display insertion mark according
|
||||
to current mouse position (see <strong><em><a href="chapter-hit-test.html">Hit Test</a></em></strong>).</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">this.listView.BeginUpdate();
|
||||
|
||||
// create groups with items and child items
|
||||
BetterListViewGroup groupRecent = new BetterListViewGroup("Recent Items");
|
||||
|
||||
groupRecent.Items.AddRange(
|
||||
new[]
|
||||
{
|
||||
"Ming Dynasty Vase",
|
||||
"Collection of Rembrandt",
|
||||
"Photos from Prokudin Gorskij"
|
||||
});
|
||||
|
||||
groupRecent.Items[1].ChildItems.AddRange(
|
||||
new[]
|
||||
{
|
||||
"The Night Watch",
|
||||
"Belshazzar's Feast"
|
||||
});
|
||||
|
||||
BetterListViewGroup groupArchived = new BetterListViewGroup("Archived Items");
|
||||
|
||||
groupArchived.Items.AddRange(
|
||||
new[]
|
||||
{
|
||||
"Statue of Zeus",
|
||||
"Rare pens from Hamburg and Dresden"
|
||||
});
|
||||
|
||||
this.listView.Groups.AddRange(
|
||||
new[]
|
||||
{
|
||||
groupRecent,
|
||||
groupArchived
|
||||
});
|
||||
|
||||
// set custom color for the insertion mark
|
||||
this.listView.ColorInsertionMark = Color.DarkGreen;
|
||||
// make the groups visible
|
||||
this.listView.ShowGroups = true;
|
||||
|
||||
this.listView.EndUpdate();
|
||||
|
||||
// this will set insertion mark every time hit test changes
|
||||
this.listView.HitTestChanged += ListViewHitTestChanged;</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">ListView.BeginUpdate()
|
||||
|
||||
' create groups with items and child items
|
||||
Dim groupRecent As New BetterListViewGroup("Recent Items")
|
||||
|
||||
groupRecent.Items.AddRange(
|
||||
New String() {
|
||||
"Ming Dynasty Vase",
|
||||
"Collection of Rembrandt",
|
||||
"Photos from Prokudin Gorskij"
|
||||
})
|
||||
|
||||
groupRecent.Items(1).ChildItems.AddRange(
|
||||
New String() {
|
||||
"The Night Watch",
|
||||
"Belshazzar's Feast"
|
||||
})
|
||||
|
||||
Dim groupArchived As New BetterListViewGroup("Archived Items")
|
||||
|
||||
groupArchived.Items.AddRange(
|
||||
New String() {
|
||||
"Statue of Zeus",
|
||||
"Rare pens from Hamburg and Dresden"
|
||||
})
|
||||
|
||||
ListView.Groups.AddRange(New BetterListViewGroup() {groupRecent, groupArchived})
|
||||
|
||||
' set custom color for the insertion mark
|
||||
ListView.ColorInsertionMark = Color.DarkGreen
|
||||
' make the groups visible
|
||||
ListView.ShowGroups = True
|
||||
|
||||
ListView.EndUpdate()
|
||||
|
||||
' this will set insertion mark every time hit test changes
|
||||
AddHandler ListView.HitTestChanged, AddressOf ListViewHitTestChanged</code></pre>
|
||||
|
||||
<p>The <span class="code">HitTestInfoChanged</span> event handler determines the
|
||||
actual insertion mark location and sets it:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">void ListViewHitTestChanged(object sender, BetterListViewHitTestChangedEventArgs eventArgs)
|
||||
{
|
||||
// get current hit test information
|
||||
BetterListViewHitTestInfo hitTestInfo = eventArgs.HitTestInfoNew;
|
||||
|
||||
// get address and drop part to assembly an insertion mark location
|
||||
BetterListViewAddress address;
|
||||
BetterListViewDropPart dropPart;
|
||||
|
||||
if (hitTestInfo.Item != null)
|
||||
{
|
||||
// the mouse cursor is located on item
|
||||
address = hitTestInfo.Item.Address;
|
||||
|
||||
if ((hitTestInfo.ItemPart & BetterListViewHitPart.VCenter) == BetterListViewHitPart.VCenter)
|
||||
{
|
||||
// the mouse cursor is located in the centre of the item - the insertion mark will point inside the item
|
||||
dropPart = BetterListViewDropPart.Inside;
|
||||
}
|
||||
else
|
||||
{
|
||||
// the mouse cursor is located on other parts of the item - the insertion mark will point before on after the item
|
||||
dropPart = (((hitTestInfo.ItemPart & BetterListViewHitPart.Bottom) == BetterListViewHitPart.Bottom)
|
||||
? BetterListViewDropPart.After
|
||||
: BetterListViewDropPart.Before);
|
||||
}
|
||||
}
|
||||
else if (
|
||||
hitTestInfo.Group != null)
|
||||
{
|
||||
// the mouse cursor is located on group
|
||||
address = hitTestInfo.Group.Address;
|
||||
dropPart = BetterListViewDropPart.Inside; //NOTE: only Inside is allowed as drop part on groups
|
||||
}
|
||||
else
|
||||
{
|
||||
// the mouse cursor is not located on item nor group
|
||||
address = null;
|
||||
dropPart = BetterListViewDropPart.Undefined;
|
||||
}
|
||||
|
||||
if (address != null)
|
||||
{
|
||||
// set insertion mark on the constructed location
|
||||
this.listView.InsertionMark = new BetterListViewInsertionMark(new BetterListViewInsertionLocation(address, dropPart));
|
||||
}
|
||||
else
|
||||
{
|
||||
// reset insertion mark
|
||||
this.listView.InsertionMark = BetterListViewInsertionMark.Empty;
|
||||
}
|
||||
}</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">Sub ListViewHitTestChanged(ByVal sender As Object, ByVal eventArgs As BetterListViewHitTestChangedEventArgs)
|
||||
|
||||
' get current hit test information
|
||||
Dim hitTestInfo As BetterListViewHitTestInfo = eventArgs.HitTestInfoNew
|
||||
|
||||
' get address and drop part to assembly an insertion mark location
|
||||
Dim address As BetterListViewAddress
|
||||
Dim dropPart As BetterListViewDropPart
|
||||
|
||||
If hitTestInfo.Item IsNot Nothing Then
|
||||
|
||||
' the mouse cursor is located on item
|
||||
address = hitTestInfo.Item.Address
|
||||
|
||||
If (hitTestInfo.ItemPart And BetterListViewHitPart.VCenter) = BetterListViewHitPart.VCenter Then
|
||||
|
||||
' the mouse cursor is located in the centre of the item - the insertion mark will point inside the item
|
||||
dropPart = BetterListViewDropPart.Inside
|
||||
|
||||
Else
|
||||
|
||||
' the mouse cursor is located on other parts of the item - the insertion mark will point before on after the item
|
||||
dropPart = (If(((hitTestInfo.ItemPart And BetterListViewHitPart.Bottom) = BetterListViewHitPart.Bottom), BetterListViewDropPart.After, BetterListViewDropPart.Before))
|
||||
|
||||
End If
|
||||
|
||||
ElseIf hitTestInfo.Group IsNot Nothing Then
|
||||
|
||||
' the mouse cursor is located on group
|
||||
address = hitTestInfo.Group.Address
|
||||
'NOTE: only Inside is allowed as drop part on groups
|
||||
dropPart = BetterListViewDropPart.Inside
|
||||
|
||||
Else
|
||||
|
||||
' the mouse cursor is not located on item nor group
|
||||
address = Nothing
|
||||
dropPart = BetterListViewDropPart.Undefined
|
||||
|
||||
End If
|
||||
|
||||
If address IsNot Nothing Then
|
||||
|
||||
' set insertion mark on the constructed location
|
||||
ListView.InsertionMark = New BetterListViewInsertionMark(New BetterListViewInsertionLocation(address, dropPart))
|
||||
|
||||
Else
|
||||
|
||||
' reset insertion mark
|
||||
ListView.InsertionMark = BetterListViewInsertionMark.Empty
|
||||
|
||||
End If
|
||||
|
||||
End Sub</code></pre>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-hit-test.html"><strong>
|
||||
« Hit Test</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-item-hierarchy.html"><strong>Item Hierarchy »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,447 @@
|
||||
<!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>Introduction, Comparison</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"></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="../../../better-listview-express/quick-start-guide.html"><strong>Quick Start »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Introduction, Comparison</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<h2>Quick Summary</h2>
|
||||
|
||||
|
||||
<p>Better ListView is a WinForms control written from scratch entirely
|
||||
in C#. It has been designed to completely replace the regular .NET list
|
||||
view control, and it comes with many additional features, improvements and
|
||||
better native look and feel (including Aero support).</p>
|
||||
|
||||
|
||||
<h2>Compatibility</h2>
|
||||
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p>Compatible with: Visual Studio 2010, 2008, 2005 (and newer),
|
||||
with full designer support.</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>For C#, Visual Basic .NET (VB.NET), managed C++, and other CLI
|
||||
languages.</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Compatible with .NET 4, .NET 3.5, .NET 3, .NET 2, and
|
||||
newer.</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Runs on Windows 7, Vista, 2003, XP, 2000, and newer, both 32-bit
|
||||
and 64-bit.</p>
|
||||
</li>
|
||||
</ul>
|
||||
<h2>Benefits</h2>
|
||||
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p>More features (see the comparison below).</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Fixed all bugs and quirks of the regular .NET ListView.</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Minimum learning needed (similar naming conventions,
|
||||
etc).</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Single DLL file with simple XCOPY deployment,
|
||||
royalty-free.</p>
|
||||
</li>
|
||||
<li>
|
||||
<p>Great native look and feel (including Aero support).</p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>Because Better ListView is written entirely from scratch in pure
|
||||
managed code, it adds functionality hardly achievable by just wrapping the
|
||||
regular ListView control. Such features include hierarchical items, image
|
||||
thumbnails, data binding, multi-line items ... and more!</p>
|
||||
|
||||
<p>The Better ListView source code consists of a single C# project
|
||||
without any external dependencies, it is clean, readable, fully commented
|
||||
and readily extensible.</p>
|
||||
|
||||
<p>You can <strong><em>save time</em></strong> with many of the inbuilt
|
||||
features (sorting, item reordering).</p>
|
||||
|
||||
|
||||
<h2>Side-by-side comparison with regular .NET ListView</h2>
|
||||
|
||||
|
||||
<br><p class="table-name">Extra Features</p>
|
||||
<br><table class="comparison">
|
||||
<tr>
|
||||
<td class="comparison-line-odd"></td>
|
||||
<td class="comparison-other"><strong><em>Better ListView</em></strong></td>
|
||||
<td class="comparison-other"><strong><em>Better ListView
|
||||
Express</em></strong></td>
|
||||
<td class="comparison-other"><strong><em>Regular .NET ListView</em></strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-even">Data binding</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-odd">Automatic sizing of items</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-even">Background image with transparency</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-odd">Embedded controls</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-even">Serialization to XML and binary</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-odd">Inbuilt sorting</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-even">Automatic tooltips on items</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-odd">Read-only mode</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-even">Hierarchical items</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-odd">Column reordering</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-even">Item reordering</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-odd">Text on empty list</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-even">Multi-line items</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-odd">Thumbnails view, customizable image shadows and
|
||||
borders</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-even">Multi-column sorting</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-odd">Text formatting (trimming, ellipsis, line breaks)</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-even">Three state checkboxes</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-odd">Separate context menus for items, columns and
|
||||
groups</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-even">Alphanumeric sorting support</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-odd">Separate context menus on columns, items and groups</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-even">Automatic tooltips on columns and groups</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-odd">Custom tooltips</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-even">Saving and loading Better ListView content</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-odd">Individual columns can be hidden</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-even">Combined items</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-odd">Non-selectable items</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
</table>
|
||||
<p> </p>
|
||||
|
||||
<br><p class="table-name">Improved Features</p>
|
||||
<br><table class="comparison">
|
||||
<tr>
|
||||
<td class="comparison-line-odd"></td>
|
||||
<td class="comparison-other"><strong><em>Better ListView</em></strong></td>
|
||||
<td class="comparison-other"><strong><em>Better ListView
|
||||
Express</em></strong></td>
|
||||
<td class="comparison-other"><strong><em>Regular .NET ListView</em></strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-even">Custom label edit (combos, date/time, ...), sub-item label
|
||||
edit</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-odd">Flicker-free</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-even">Check boxes in all views</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-odd">Detailed hit test</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-even">Images supported on columns, groups, items,
|
||||
sub-items</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-odd">Drag and drop: with effects, cross-application item
|
||||
dragging</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-even">Multiple tooltips attachable everywhere</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-odd">Owner drawing with full control</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-even">Searching by typing: explorer-like behaviour,
|
||||
customizable</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-odd">Full native theme support (modern look on Windows
|
||||
Vista/7)</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-even">Groups: focusable, preserve item order</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-odd">Groups: collapsible</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-even">Column headers in all views</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-odd">Customizable item/column/group sizes and paddings in every
|
||||
view</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-even">Check boxes can be hidden on individual items</td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
</tr>
|
||||
</table>
|
||||
<p> </p>
|
||||
|
||||
<br><p class="table-name">Dropped Features</p>
|
||||
<br><table class="comparison">
|
||||
<tr>
|
||||
<td class="comparison-line-odd"></td>
|
||||
<td class="comparison-other"><strong><em>Better ListView</em></strong></td>
|
||||
<td class="comparison-other"><strong><em>Better ListView
|
||||
Express</em></strong></td>
|
||||
<td class="comparison-other"><strong><em>Regular .NET ListView</em></strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-even">Accessibility support</td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-odd">Item arrangement</td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-even">Hot tracking</td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-odd">RTL support</td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-even">State image list</td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="comparison-line-odd">Virtual mode</td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-no"><strong>×</strong></td>
|
||||
<td class="comparison-yes"><strong>●</strong></td>
|
||||
</tr>
|
||||
</table>
|
||||
<p> </p>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="../../../better-listview-express/quick-start-guide.html"><strong>Quick Start »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,279 @@
|
||||
<!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 Hierarchy</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-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-item-reorder.html"><strong>Item Reordering »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Item Hierarchy</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<br><hr>
|
||||
<p class="note">Item hierarchy is not supported in <strong><em>Better ListView
|
||||
Express</em></strong>.</p>
|
||||
<hr>
|
||||
<br><p>Items can be organized in tree structure by using
|
||||
<span class="code">BetterListViewItem.ChildItems</span> collection. Simply add items as
|
||||
other item's children to create a parent-child relationship:</p>
|
||||
|
||||
<p class="images"><img src="item-hierarchy-overview.png"></p>
|
||||
|
||||
<p>Hierarchical items can be used in combination with columns and <strong><em><a href="chapter-groups.html">Groups</a></em></strong>:</p>
|
||||
|
||||
<p class="images"><img src="item-hierarchy-groups.png"></p>
|
||||
|
||||
<p>Child items can use sub-items as well.</p>
|
||||
|
||||
<p>Parent items can be collapsed and expanded through expand buttons.
|
||||
Expand buttons appear automatically when there are any children. Expand
|
||||
buttons can be disabled on all items using
|
||||
<span class="code">ShowItemExpandButtons</span> property or individually using
|
||||
<span class="code">BetterListViewItem.AllowShowExpandButton</span>.</p>
|
||||
|
||||
<h2>Adjusting Indentation</h2>
|
||||
|
||||
|
||||
<p>By default, the child items have indentation of an expand button
|
||||
size. Indentation can be adjusted by settings <span class="code">Indent</span> property
|
||||
to any non-negative value (the indentation unit is pixels). To resume
|
||||
default indentation, set the property to
|
||||
<span class="code">BetterListView.DefaultIndent</span>. Following images show effect of
|
||||
different indentation:</p>
|
||||
|
||||
<p class="images"><img src="item-hierarchy-indent-small.png"><img src="item-hierarchy-indent-large.png"></p>
|
||||
|
||||
|
||||
<h2>Traversing Hierarchical Items</h2>
|
||||
|
||||
|
||||
<p><span class="code">BetterListViewItem</span> implements <span class="code">IEnumerable</span>
|
||||
interface to allow traversing through all its child items in a foreach
|
||||
cycle:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">foreach (BetterListViewItem itemChild in items)
|
||||
{
|
||||
// ...
|
||||
}</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">For Each itemChild As BetterListViewItem In items
|
||||
' ...
|
||||
Next</code></pre>
|
||||
|
||||
<p>The same is possible on whole <span class="code">BetterListView</span>; it also
|
||||
implements <span class="code">IEnumerable</span> to enumerate all items within the
|
||||
list, including child items.</p>
|
||||
|
||||
|
||||
<h2>Navigation in Hierarchy</h2>
|
||||
|
||||
|
||||
<p>Multiple levels of hierarchy are possible.
|
||||
<span class="code">BetterListViewItem</span> has following properties for easy
|
||||
navigation in item hierarchy:</p>
|
||||
|
||||
<ul style="list-style:none">
|
||||
<li>
|
||||
<span class="code">Address</span><ul style="list-style:none"><li>
|
||||
<p>Location of the item within hierarchy.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">ChildItems</span><ul style="list-style:none"><li>
|
||||
<p>Child items of the item.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">LastAvailableChildItem</span><ul style="list-style:none"><li>
|
||||
<p>The last (bottom) child item that can be scrolled into
|
||||
view.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">Level</span><ul style="list-style:none"><li>
|
||||
<p>Item level in hierarchy (the top level is 0).</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">ParentItem</span><ul style="list-style:none"><li>
|
||||
<p>Parent item of the item (one level up).</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
</ul>
|
||||
<h2>
|
||||
<a name="addressing-elements" id="addressing-elements"></a>Addressing Elements</h2>
|
||||
|
||||
|
||||
<p>Since Better ListView supports <strong><em><a href="chapter-item-hierarchy.html">Hierarchical items</a></em></strong> there
|
||||
is a need for addressing items on different levels of hierarchy. When
|
||||
using only the Items list, <span class="code">BetterListViewItem.Index</span> property
|
||||
is sufficient. Child items (contained in
|
||||
<span class="code">BetterListViewItem.ChildItems </span>collection) has its own
|
||||
indices, so there can be several items with <span class="code">Index</span> property
|
||||
equal to <span class="code">0</span>, for example. To localize every element (item or
|
||||
group) uniquely, use the <span class="code">Address</span> property:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewGroup.Address</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewItem.Address</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>Address is a structure that can be represented as string (via
|
||||
<span class="code">ToString</span> method) or parsed from such string. Element address
|
||||
looks like this:</p>
|
||||
|
||||
<pre>5:7.3</pre>
|
||||
|
||||
<p>The first number followed by colon (prefix) is a group index. The
|
||||
rest of numbers represent indices of items and child items separated by
|
||||
periods (in this case: <strong><em>item with index 3, which is a child item
|
||||
of item with index 7</em></strong>).</p>
|
||||
|
||||
<p>If there are no groups, the prefix is not present.</p>
|
||||
|
||||
<p><span class="code">BetterListViewAddress</span> structure implements
|
||||
<span class="code">IComparable</span>, so the two addresses can be compared. Element
|
||||
that is displayed above other element in Better ListView has always lower
|
||||
address value. Addresses can also be compared using operators
|
||||
<span class="code"><</span>, <span class="code">></span>, <span class="code"><=</span> and
|
||||
<span class="code">>=</span>.</p>
|
||||
|
||||
|
||||
<h2>Get Item/Group for the Given Address</h2>
|
||||
|
||||
|
||||
<p>There are two methods for retrieving items and groups for the given
|
||||
address:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">GetGroupFromAddress(BetterListViewAddress)</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">GetItemFromAddress(BetterListViewAddress)</span></p>
|
||||
</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("Documents", 256);
|
||||
|
||||
// create first top-level item
|
||||
BetterListViewItem itemAudio = new BetterListViewItem("Audio Files");
|
||||
|
||||
// add children to the first top-level item
|
||||
itemAudio.ChildItems.AddRange(
|
||||
new[]
|
||||
{
|
||||
new BetterListViewItem("Call with Josh (2011-10-6).mp3"),
|
||||
new BetterListViewItem("Great Ringtone.mp3")
|
||||
});
|
||||
|
||||
// create second top-level item
|
||||
BetterListViewItem itemVideo = new BetterListViewItem("Video Files");
|
||||
|
||||
// add children to the second top-level item
|
||||
itemVideo.ChildItems.AddRange(
|
||||
new[]
|
||||
{
|
||||
new BetterListViewItem("Annual Conference.avi")
|
||||
});
|
||||
|
||||
// add the top-level items to list
|
||||
// NOTE: children are added automatically
|
||||
this.listView.Items.AddRange(
|
||||
new[]
|
||||
{
|
||||
itemAudio,
|
||||
itemVideo
|
||||
});
|
||||
|
||||
this.listView.EndUpdate();</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">' Add any initialization after the InitializeComponent() call.
|
||||
ListView.BeginUpdate()
|
||||
|
||||
ListView.Columns.Add ("Documents", 256)
|
||||
|
||||
' create first top-level item
|
||||
Dim itemAudio As New BetterListViewItem ("Audio Files")
|
||||
|
||||
' add children to the first top-level item
|
||||
itemAudio.ChildItems.AddRange (
|
||||
New BetterListViewItem() { _
|
||||
New BetterListViewItem ("Call with Josh (2011-10-6).mp3"),
|
||||
New BetterListViewItem ("Great Ringtone.mp3")
|
||||
})
|
||||
|
||||
' create second top-level item
|
||||
Dim itemVideo As New BetterListViewItem ("Video Files")
|
||||
|
||||
' add children to the second top-level item
|
||||
itemVideo.ChildItems.AddRange (
|
||||
New BetterListViewItem() { _
|
||||
New BetterListViewItem ("Annual Conference.avi")
|
||||
})
|
||||
|
||||
' add the top-level items to list
|
||||
' NOTE: children are added automatically
|
||||
ListView.Items.AddRange (
|
||||
New BetterListViewItem() { _
|
||||
itemAudio,
|
||||
itemVideo
|
||||
})
|
||||
|
||||
ListView.EndUpdate()</code></pre>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.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-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-item-reorder.html"><strong>Item Reordering »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,211 @@
|
||||
<!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-item-hierarchy.html"><strong>
|
||||
« Item Hierarchy</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/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="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<br><hr>
|
||||
<p class="note">Item reordering is not supported in <strong><em>Better ListView
|
||||
Express</em></strong>.</p>
|
||||
<hr>
|
||||
<br><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>Item reorder checking is performed during item reordering and looks
|
||||
whether an item is not put into itself (into its own children). For
|
||||
example, when <span class="code">AllowCreateChild</span> reordering option is enabled,
|
||||
then the check looks whether user is not making child item under the
|
||||
reordered item.</p>
|
||||
|
||||
<p>It is possible to add custom checking (e.g. when item should not be
|
||||
placed some specific locations with item reordering) by handling
|
||||
<span class="code">CheckItemReorder</span> event and then set
|
||||
<span class="code">BetterListViewCheckItemReorderEventArgs.IsValid</span> to
|
||||
<span class="code">false</span>. Event data contains source items, target location and
|
||||
current reordering options.</p>
|
||||
|
||||
|
||||
<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="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-item-hierarchy.html"><strong>
|
||||
« Item Hierarchy</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/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 ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,303 @@
|
||||
<!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>Items</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-item-reorder.html"><strong>
|
||||
« Item Reordering</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-label-edit.html"><strong>Label Editing »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Items</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<p>Better ListView items can be selected or their check state changed in
|
||||
two ways - setting properties on items or using specific collections.</p>
|
||||
|
||||
<h2>Selecting Items</h2>
|
||||
|
||||
|
||||
<p>The easy way to select or deselect some item is to set
|
||||
<span class="code">BetterListViewItem.Selected</span> property to
|
||||
<span class="code">true</span>.</p>
|
||||
|
||||
<p>When you need to select multiple items, it would be more efficient
|
||||
to use one of these collections:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">BetterListView.SelectedIndices</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListView.SelectedItems</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>These properties have only getter, so to edit selection, simply
|
||||
modify the collection. For example, the code to select all items in the
|
||||
list would look like this:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">listView.SelectedItems.Set(listView.Items);</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">ListView.SelectedItems.Set(listView.Items)</code></pre>
|
||||
|
||||
<p>In addition to standard collection operations
|
||||
(<strong><em>add</em></strong>, <strong><em>remove</em></strong>,
|
||||
<strong><em>clear</em></strong>...) the collections provide a <span class="code">Set</span>
|
||||
method allowing to change selection from one set of items to
|
||||
another.</p>
|
||||
|
||||
<p>Note that when you use <span class="code">SelectedIndices</span>, you obtain and
|
||||
can set only indices of top-level items, while <span class="code">SelectedItems</span>
|
||||
allows you to set selections for hierarchical items as well.</p>
|
||||
|
||||
<p>If you are accustomed to use <strong><em><a href="chapter-data.html">Data Binding</a></em></strong>, the following
|
||||
properties provide you the means for selecting items via addressing
|
||||
objects they represent:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">BetterListView.SelectedValue</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListView.SelectedValues</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<h2>Checking Items</h2>
|
||||
|
||||
|
||||
<p>To change check state of some item, set
|
||||
<span class="code">BetterListViewItem.Checked</span> or
|
||||
<span class="code">BetterListViewItem.CheckState</span> property. The
|
||||
<span class="code">CheckState</span> property allows you to set indeterminate state of
|
||||
items (supported if <span class="code">BetterListView.CheckBoxes</span> property is set
|
||||
to <span class="code">ThreeState</span>), while <span class="code">Checked</span> is just for
|
||||
checked/unchecked state.</p>
|
||||
|
||||
<p>When you need to check multiple items, it would be more efficient to
|
||||
use one of these collections:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">BetterListView.SelectedIndices</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListView.SelectedItems</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>These properties have only getter, so to edit selection, simply
|
||||
modify the collection. For example, the code to un-check all items in the
|
||||
list would look like this:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">listView.CheckedItems.Clear();</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">ListView.CheckedItems.Clear()</code></pre>
|
||||
|
||||
<p>In addition to standard collection operations
|
||||
(<strong><em>add</em></strong>, <strong><em>remove</em></strong>,
|
||||
<strong><em>clear</em></strong>...) the collections provide a <span class="code">Set</span>
|
||||
method allowing to change selection from one set of items to
|
||||
another.</p>
|
||||
|
||||
<p>Note that when you use <span class="code">CheckedIndices</span>, you obtain and
|
||||
can set only indices of top-level items, while <span class="code">CheckedItems</span>
|
||||
allows you to set selections for hierarchical items as well.</p>
|
||||
|
||||
<br><hr>
|
||||
<p class="note">The <span class="code">CheckedItems</span> and <span class="code">CheckedIndices</span>
|
||||
collections do not contain items in indeterminate check state.</p>
|
||||
<hr>
|
||||
<br><h2>Detecting selection and check state changes</h2>
|
||||
|
||||
|
||||
<p>Better ListView provides several events to detect when selection or
|
||||
check state of items change:</p>
|
||||
|
||||
<ul style="list-style:none">
|
||||
<li>
|
||||
<span class="code">ChecktedItemsChanged</span><ul style="list-style:none"><li>
|
||||
<p>Raised when value of <span class="code">CheckedItems</span> property has
|
||||
changed. It is raised once every time check state of items changes,
|
||||
even when multiple items are checked in one operation.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">ItemCheck</span><ul style="list-style:none"><li>
|
||||
<p>Raised when item check state is about to change. You can
|
||||
cancel the check operation in the event handler. If multiple items
|
||||
change its check state, this event is raised multiple times.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">ItemChecked</span><ul style="list-style:none"><li>
|
||||
<p>Raised after an item has been checked. If multiple items
|
||||
change its check state, this event is raised multiple times.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">ItemSelectionChanged</span><ul style="list-style:none"><li>
|
||||
<p>Raised for every item whose <span class="code">Selected</span> property has
|
||||
changed. If multiple items has been selected and de-selected, this
|
||||
event will be raised multiple times.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">SelectedIndexChanged</span><ul style="list-style:none"><li>
|
||||
<p>Raised when index of the focused selected item has been
|
||||
changed. This event is useful when only single item can be selected
|
||||
(i.e. <span class="code">MultiSelect</span> is set to <span class="code">false</span>).</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">SelectedItemsChanged</span><ul style="list-style:none"><li>
|
||||
<p>Raised when value of <span class="code">SelectedItems</span> property has
|
||||
changed. It is raised once every time selection changes, even when
|
||||
multiple items are selected in one operation (e.g. Shift+click on
|
||||
some item).</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
</ul>
|
||||
<p>It should be noted that selection is tied with Better ListView,
|
||||
rather than with individual items. So if you move item from one ListView
|
||||
to another, the selection state of the item is <strong><em>not</em></strong>
|
||||
preserved.</p>
|
||||
|
||||
<p>On the other hand, check state is a property of each item. If you
|
||||
move item from one ListView to another, check state of the item is
|
||||
preserved.</p>
|
||||
|
||||
|
||||
<h2>Check If Any Item Is Selected</h2>
|
||||
|
||||
|
||||
<p>To check if there is any item selected, use
|
||||
<span class="code">IsAnythingSelected</span> boolean property.</p>
|
||||
|
||||
<p>You can also test whether <span class="code">SelectedItems.Count</span> or
|
||||
<span class="code">SelectedIndcies.Count</span> is equal to zero, but the above
|
||||
property provides potentially faster response.</p>
|
||||
|
||||
|
||||
<h2>Hiding and Preserving Selections</h2>
|
||||
|
||||
|
||||
<p>By default, when Better ListView loses focus, selections on items
|
||||
disappears.</p>
|
||||
|
||||
<p>To preserve display of item selection, set
|
||||
<span class="code">HideSelection</span> property to <span class="code">false</span>. This will cause
|
||||
selections on unfocused control to be displayed in disabled state.</p>
|
||||
|
||||
<p>If you need to draw selection always highlighted, use the
|
||||
<span class="code">HideSelectionMode</span> property, which is more thorough than
|
||||
<span class="code">HideSelection</span>. The following images show unfocused Better
|
||||
ListView with <span class="code">HideSelectionMode</span> property set to
|
||||
<span class="code">Hide</span>, <span class="code">Disable</span> and
|
||||
<span class="code">KeepSelection</span>:</p>
|
||||
|
||||
<p class="images"><img src="items-hide.png"><img src="items-disable.png"><img src="items-keep.png"></p>
|
||||
|
||||
|
||||
<h2>Non-selectable Items</h2>
|
||||
|
||||
|
||||
<p>Every item can is selectable by default. When
|
||||
<span class="code">BetterListViewItem.Selectable</span> property is set to
|
||||
<span class="code">false</span>, the item can no longer be selected by keyboard or
|
||||
mouse. These items can still be selected from user code (e.g. calling
|
||||
<span class="code">SelectedItems.Add</span>).</p>
|
||||
|
||||
<p>The following images show that non-selectable items can be used as
|
||||
separators (with owner drawing) and simply as disabled items - the
|
||||
non-selectable items can still be expanded/collapsed if contain
|
||||
children:</p>
|
||||
|
||||
<p class="images"><img src="items-nonselectable1.png"><img src="items-nonselectable2.png"></p>
|
||||
|
||||
|
||||
<h2>
|
||||
<a name="combined-items" id="combined-items"></a>Combined Items</h2>
|
||||
|
||||
|
||||
<p>Parent and child items can be selected separately, by default. You
|
||||
can combine parent and child items to behave just like a single item by
|
||||
setting <span class="code">BetterListViewItem.AllowSelectChildItems</span> to
|
||||
<span class="code">false</span>.</p>
|
||||
|
||||
<p>Even when combined, child items can use individual check boxes and
|
||||
can be detected with a hit test (see <strong><em><a href="chapter-hit-test.html">Hit Test</a></em></strong> for more
|
||||
information).</p>
|
||||
|
||||
<p>The following screenshots show combined items in action:</p>
|
||||
|
||||
<p class="images"><img src="items-combineditems1.png"><img src="items-combineditems2.png"></p>
|
||||
|
||||
<p>To determine which item is actually the "selectable parent" one, use
|
||||
a <span class="code">BetterListViewItem.SelectableItem</span> property. The child items
|
||||
provide reference to parent item with <span class="code">AllowSelectChildItems</span>
|
||||
property set to <span class="code">false</span> in the
|
||||
<span class="code">BetterListViewItem.SelectableItem</span> property.</p>
|
||||
|
||||
|
||||
<h2>Hiding Items</h2>
|
||||
|
||||
|
||||
<p>Items can be hidden by setting
|
||||
<span class="code">BetterListViewItem.Visible</span> property to
|
||||
<span class="code">false</span>.</p>
|
||||
|
||||
<p>The hiding affects only display of the item, the item is still
|
||||
present in its owner collection.</p>
|
||||
|
||||
<p>If you hide an item containing child items, the child items will be
|
||||
hidden as well.</p>
|
||||
|
||||
<p>Hiding have the same effect as if the item has been removed from
|
||||
<span class="code">Items</span> (or <span class="code">BetterListView.ChildItems</span>,
|
||||
respectively) collection, but is still present in the collection.</p>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-item-reorder.html"><strong>
|
||||
« Item Reordering</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-label-edit.html"><strong>Label Editing »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,225 @@
|
||||
<!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>Label Editing</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-items.html"><strong>
|
||||
« Items</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-layout.html"><strong>Layout Properties »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Label Editing</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<p>Label editing allows user to edit items and sub-items on the fly. Just
|
||||
set the <span class="code">LabelEdit</span> property to <span class="code">true</span> (or
|
||||
<span class="code">LabelEditModeItems</span> to
|
||||
<span class="code">BetterListViewLabelEditMode.Text</span>) and the user is allowed to
|
||||
edit items using text box:</p>
|
||||
|
||||
<p class="images"><img src="label-editing-control1.png"></p>
|
||||
|
||||
<p>To enable label editing for sub-items, set the
|
||||
<span class="code">LabelEditModeSubItems</span> property to value other than
|
||||
<span class="code">LabelEditModeSubItems.None</span>. For example, you can use different
|
||||
editing controls, like a combo box by setting
|
||||
<span class="code">LabelEditModeSubItems</span> to
|
||||
<span class="code">LabelEditModeSubItems.CustomControl</span>. Then handler
|
||||
<span class="code">RequestEmbeddedControl</span> event and return the editing control in
|
||||
the event handler.</p>
|
||||
|
||||
<p>You can also specify position of the editing control by setting
|
||||
<span class="code">BetterListViewRequestEmbeddedControlEventArgs.ControlPlacement</span>.
|
||||
The position is determined from sub-item text position by default.</p>
|
||||
|
||||
<p class="images"><img src="label-editing-control2.png"></p>
|
||||
|
||||
<p>There are three basic editing controls pre-packed in Better
|
||||
ListView:</p>
|
||||
|
||||
<ul style="list-style:none">
|
||||
<li>
|
||||
<span class="code">BetterListViewTextBoxEmbeddedControl</span><ul style="list-style:none"><li>
|
||||
<p><span class="code">TextBox</span>-based control used for basic label
|
||||
editing.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">BetterListViewComboBoxEmbeddedControl</span><ul style="list-style:none"><li>
|
||||
<p>ComboBox-based control used for editing enumerations.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">BetterListViewDateTimePickerEmbeddedControl</span><ul style="list-style:none"><li>
|
||||
<p>DateTimePicker-based control used for editing date and time
|
||||
values.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
</ul>
|
||||
<p>If you want to create your own editing controls, see <strong><em><a href="chapter-embedded-controls.html">Embedded Controls</a></em></strong>, for
|
||||
more information.</p>
|
||||
|
||||
<h2>Default Action</h2>
|
||||
|
||||
|
||||
<p>When label edit is terminated by the control (e.g. when user clicks
|
||||
outside the editing control or Better ListView loses focus), the edited
|
||||
data can be either accepted or cancelled.</p>
|
||||
|
||||
<p>By default, the data is accepted, but this can be changed by setting
|
||||
<span class="code">LabelEditDefaultAccept</span> to <span class="code">false</span>.</p>
|
||||
|
||||
|
||||
<h2>Label Editing from User Code</h2>
|
||||
|
||||
|
||||
<p>Label editing can be initiated and terminated from user code using
|
||||
<span class="code">BeginEdit</span> and <span class="code">EndEdit</span> methods.</p>
|
||||
|
||||
<p><span class="code">BeginEdit</span> is adopted from .NET ListView and allows you
|
||||
to start label editing of a specific sub-item (e.g. when some keyboard
|
||||
shortcut is pressed).</p>
|
||||
|
||||
<p><span class="code">EndEdit</span> can be used to terminate label editing at any
|
||||
time. This method can be called even when label editing is not currently
|
||||
in progress.</p>
|
||||
|
||||
|
||||
<h2>Sample Source Code</h2>
|
||||
|
||||
|
||||
<p>The following sample shows initialization of a Better ListView with
|
||||
custom label editing for sub-items:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">this.listView.BeginUpdate();
|
||||
|
||||
this.listView.Columns.AddRange(new[] { "Property", "Visiblity" });
|
||||
|
||||
this.listView.Items.Add(new[] { "AlphaProperty", "public" });
|
||||
this.listView.Items.Add(new[] { "BetaProperty", "internal" });
|
||||
this.listView.Items.Add(new[] { "GammaProperty", "private" });
|
||||
|
||||
// start editing items with just single click (optional)
|
||||
this.listView.LabelEditActivation = BetterListViewLabelEditActivation.SingleClick;
|
||||
// we would like to edit sub-items, so set editing mode of sub-items
|
||||
this.listView.LabelEditModeSubItems = BetterListViewLabelEditMode.CustomControl;
|
||||
|
||||
this.listView.EndUpdate();
|
||||
|
||||
// custom label editing needs to handle this event to obtain actual editing control
|
||||
this.listView.RequestEmbeddedControl += ListViewRequestEmbeddedControl;</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">ListView.BeginUpdate()
|
||||
|
||||
ListView.Columns.AddRange (New String() {"Property", "Visiblity"})
|
||||
|
||||
ListView.Items.Add (New String() {"AlphaProperty", "public"})
|
||||
ListView.Items.Add (New String() {"BetaProperty", "internal"})
|
||||
ListView.Items.Add (New String() {"GammaProperty", "private"})
|
||||
|
||||
' start editing items with just single click (optional)
|
||||
ListView.LabelEditActivation = BetterListViewLabelEditActivation.SingleClick
|
||||
' we would like to edit sub-items, so set editing mode of sub-items
|
||||
ListView.LabelEditModeSubItems = BetterListViewLabelEditMode.CustomControl
|
||||
|
||||
ListView.EndUpdate()
|
||||
|
||||
' custom label editing needs to handle this event to obtain actual editing control
|
||||
AddHandler ListView.RequestEmbeddedControl, AddressOf ListViewRequestEmbeddedControl</code></pre>
|
||||
|
||||
<p>The <span class="code">RequestEmbeddedControl</span> event handler provides the
|
||||
actual label editing control:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">IBetterListViewEmbeddedControl ListViewRequestEmbeddedControl(object sender, BetterListViewRequestEmbeddedControlEventArgs eventArgs)
|
||||
{
|
||||
if (eventArgs.SubItem.Index == 1) // user edits the first sub-item
|
||||
{
|
||||
// create ComboBox editing control from BetterListView
|
||||
BetterListViewComboBoxEmbeddedControl comboBoxEmbeddedControl = new BetterListViewComboBoxEmbeddedControl();
|
||||
|
||||
comboBoxEmbeddedControl.DropDownStyle = ComboBoxStyle.DropDownList;
|
||||
|
||||
// add items into the editing control
|
||||
comboBoxEmbeddedControl.Items.AddRange(
|
||||
new[]
|
||||
{
|
||||
"public",
|
||||
"internal",
|
||||
"private"
|
||||
});
|
||||
|
||||
return comboBoxEmbeddedControl;
|
||||
}
|
||||
|
||||
return null;
|
||||
}</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">Function ListViewRequestEmbeddedControl (ByVal sender As Object,
|
||||
ByVal eventArgs As BetterListViewRequestEmbeddedControlEventArgs) _
|
||||
As IBetterListViewEmbeddedControl
|
||||
|
||||
If eventArgs.SubItem.Index = 1 Then
|
||||
|
||||
' user edits the first sub-item
|
||||
' create ComboBox editing control from BetterListView
|
||||
Dim comboBoxEmbeddedControl As New BetterListViewComboBoxEmbeddedControl()
|
||||
|
||||
comboBoxEmbeddedControl.DropDownStyle = ComboBoxStyle.DropDownList
|
||||
|
||||
' add items into the editing control
|
||||
comboBoxEmbeddedControl.Items.AddRange (New String() {"public", "internal", "private"})
|
||||
|
||||
Return comboBoxEmbeddedControl
|
||||
|
||||
End If
|
||||
|
||||
Return Nothing
|
||||
|
||||
End Function</code></pre>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-items.html"><strong>
|
||||
« Items</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-layout.html"><strong>Layout Properties »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,421 @@
|
||||
<!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>Layout Properties</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-label-edit.html"><strong>
|
||||
« Label Editing</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-multi-line.html"><strong>Multi-line Items »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Layout Properties</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<br><hr>
|
||||
<p class="note">Layout properties are not supported in <strong><em>Better ListView
|
||||
Express</em></strong>.</p>
|
||||
<hr>
|
||||
<br><p>Better ListView consists of three visual parts: <strong><em>column
|
||||
headers</em></strong>, <strong><em>items</em></strong>
|
||||
(<strong><em>sub-items</em></strong>) and <strong><em>groups</em></strong>. Each of
|
||||
these has its corresponding <span class="code">BetterListViewLayout</span> instance that
|
||||
defines how to measure and position elements in these parts. Furthermore,
|
||||
every view has its layout, because it behaves differently, can contain
|
||||
images of different size, etc. The layout instances can be accessed through
|
||||
these properties:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">LayoutColumns</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">LayoutGroupsCurrent</span> (<strong><em>depends on current
|
||||
view</em></strong>)</p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">LayoutItemsCurrent</span> (<strong><em>depends on current
|
||||
view</em></strong>)</p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>There are also properties for specific views, so you can address
|
||||
layout properties of other than current view:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">LayoutGroupsHorizontal</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">LayoutGroupsVertical</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">LayoutItemsDetails</span> (<strong><em>used when columns are
|
||||
not present in Details view</em></strong>)</p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">LayoutItemsDetailsColumns</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">LayoutItemsLargeIcon</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">LayoutItemsList</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">LayoutItemsSmallIcon</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">LayoutItemsThumbnails</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">LayoutItemsTile</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>All the layout properties properties always reference the same
|
||||
instance of <span class="code">BetterListViewLayout</span> except for
|
||||
<span class="code">LayoutGroupsCurrent</span> and <span class="code">LayoutItemsCurrent</span> which
|
||||
depend on current view. There are also two layouts for
|
||||
<strong><em>Details</em></strong> view. This is because Better ListView uses
|
||||
different layout for items in <strong><em>Details</em></strong> view with and
|
||||
without columns (regular .NET ListView supports <strong><em>Details</em></strong>
|
||||
view, but only when columns are visible).</p>
|
||||
|
||||
<p>These layout contain properties defining sizes and paddings of all the
|
||||
elements and element parts. These properties are descibed below in their
|
||||
contexts.</p>
|
||||
|
||||
<h2>
|
||||
<a name="text-layout" id="text-layout"></a>Text Layout</h2>
|
||||
|
||||
|
||||
<p>The only common property for all layouts is
|
||||
<span class="code">TextPadding</span>, which is the spacing around text area.</p>
|
||||
|
||||
<p>There is no property for settings text size, because it depends on
|
||||
text in each element. There is, however, some control over text height. It
|
||||
is different for column header, group, and item layout.</p>
|
||||
|
||||
<p>Column header and group layouts share a property called
|
||||
<span class="code">MinimumTextHeight</span>. This is a minimum allowed height of the
|
||||
text area. When the actual text height is smaller than this value, the
|
||||
text area will have <span class="code">MinimumTextHeight</span> pixels in vertical
|
||||
dimension and the text will be centered vertically in it.</p>
|
||||
|
||||
<p>Column header and item layouts have an extra property called
|
||||
<span class="code">MaximumTextLines</span> which allows displaying multi-line text.
|
||||
When its value is greater than <span class="code">1</span>, the text is first broken
|
||||
into multiple lines up to the specified value. Text trimming is used when
|
||||
there is no remaining lines left:</p>
|
||||
|
||||
<p class="images"><img src="layout-multiline1.png"></p>
|
||||
|
||||
<p>In this example, <span class="code">MaximumTextLines</span> property was set to
|
||||
<span class="code">3</span> for both column headers and items:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">listView.LayoutColumnHeaders.MaximumTextLines = listView.LayoutItemsCurrent.MaximumTextLines = 3;</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">ListView.LayoutColumnHeaders.MaximumTextLines = ListView.LayoutItemsCurrent.MaximumTextLines = 3</code></pre>
|
||||
|
||||
<p>When the column width is too small to maintain given text, even then
|
||||
the text is trimmed:</p>
|
||||
|
||||
<p class="images"><img src="layout-multiline2.png"></p>
|
||||
|
||||
<p>Maximum allowed number of text lines can also be specified on each
|
||||
sub-item individually by setting
|
||||
<span class="code">BetterListViewSubItem.MaximumTextLines</span>.</p>
|
||||
|
||||
|
||||
<h2>
|
||||
<a name="default-alignment-trimming" id="default-alignment-trimming"></a>Default Text
|
||||
Alignment and Trimming</h2>
|
||||
|
||||
|
||||
<p>Every view defines default text alignment and trimming. For example,
|
||||
text in <strong><em>Details</em></strong> view is usually aligned on left,
|
||||
while in <strong><em>LargeIcon</em></strong> view is centered. You can set the
|
||||
<span class="code">DefaultTextAlignmentHorizontal</span>,
|
||||
<span class="code">DefaultTextAlignmentVertical</span> and
|
||||
<span class="code">DefaultTextTrimming</span> properties of the item layout.</p>
|
||||
|
||||
<p>These properties are used on item when the item has
|
||||
<span class="code">AlignHorizontal</span> property set to
|
||||
<span class="code">TextAlignmentHorizontal.Default</span>, <span class="code">AlignVertical</span>
|
||||
property to <span class="code">TextAlignmentVertical.Default</span> and
|
||||
<span class="code">TextTrimming</span> property to
|
||||
<span class="code">TextTrimming.Undefined</span>.</p>
|
||||
|
||||
<p>Text alignment and trimming can be set on each element individually
|
||||
(see <strong><em><a href="chapter-text-formatting.html">Text
|
||||
Formatting</a></em></strong>).</p>
|
||||
|
||||
|
||||
<h2>Image Layout</h2>
|
||||
|
||||
|
||||
<p>Better ListView can display images of arbitrary sizes (not only
|
||||
predefined ones) in all views and always keeps aspect ratios of the
|
||||
images.</p>
|
||||
|
||||
<p>Images are downscaled, if needed, but never upscaled (they are
|
||||
rather centered in the larger bounding box).</p>
|
||||
|
||||
<p>Image layout options affect a bounding box, in which images are
|
||||
aligned. It is also possible to set up image paddings and borders of
|
||||
different styles and sizes.</p>
|
||||
|
||||
<p>Image layout can be adjusted on all Better ListView layouts through
|
||||
the corresponding properties described below.</p>
|
||||
|
||||
|
||||
<h2>Image Size</h2>
|
||||
|
||||
|
||||
<p>Column and group layouts contain <span class="code">ImageSize</span> property to
|
||||
manually adjust area for placing images.</p>
|
||||
|
||||
<p>Item layouts contain corresponding <span class="code">ImageSizes</span> property
|
||||
with collection of <span class="code">System.Drawing.Size</span> objects. The
|
||||
collection should contain at leat one <span class="code">Size</span> instance, which is
|
||||
the size to be used for items and sub-items. When the collection contains
|
||||
more entries, item and sub-items can have different image area
|
||||
sizes.</p>
|
||||
|
||||
<p>By default, this property is adjusted automatically according to
|
||||
largest displayed images.</p>
|
||||
|
||||
<p>To set image size manually, first turn off automatic image layout
|
||||
(e.g. for items):</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">listView.LayoutOptions = (BetterListViewLayoutOptions.Auto & ~BetterListViewLayoutOptions.AutoSizeItemImage);</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">ListView.LayoutOptions = (BetterListViewLayoutOptions.Auto And Not BetterListViewLayoutOptions.AutoSizeItemImage)</code></pre>
|
||||
|
||||
<p>Then you can set image size manually for some layout:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">listView.LayoutItemsLargeIcon.ImageSizes = new ReadOnlyCollection<Size>(new[] { new Size(97, 34) });</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">ListView.LayoutItemsLargeIcon.ImageSizes = New ReadOnlyCollection(Of Size)(New Size() {New Size(97, 34)})</code></pre>
|
||||
|
||||
<p>We set bounding box for images in the <span class="code">LargeIcon</span>
|
||||
view.</p>
|
||||
|
||||
<p>The following images show how Better ListView fits larger images
|
||||
into such bounding box (displayed in gray):</p>
|
||||
|
||||
<p class="images"><img src="layout-image-large-source.png"><img src="layout-image-large-target.png"></p>
|
||||
|
||||
<p>Smaller images are just centered:</p>
|
||||
|
||||
<p class="images"><img src="layout-image-small-source.png"><img src="layout-image-small-target.png"></p>
|
||||
|
||||
|
||||
<h2>Image Border</h2>
|
||||
|
||||
|
||||
<p>Image is an element part and as such it has some padding around it.
|
||||
This is just empty space around the image to keep it in distance from
|
||||
other elements. This padding can be adjusted via
|
||||
<span class="code">BetterListViewLayoutItems.ImagePadding</span> property of the
|
||||
corresponding layout.</p>
|
||||
|
||||
<p>There are also two other properties available in item layouts, which
|
||||
allows setting painted frame around the image. These are:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">ImageBorderColor</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">ImageBorderType</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">ImageBorderThickness</span> (in
|
||||
<strong><em>pixels</em></strong>)</p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>For example, setting:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">listView.LayoutItemsCurrent.ImageBorderType = ImageBorderType.SingleOffset;
|
||||
listView.LayoutItemsCurrent.ImageBorderThickness = 2;</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">ListView.LayoutItemsCurrent.ImageBorderType = ImageBorderType.SingleOffset
|
||||
ListView.LayoutItemsCurrent.ImageBorderThickness = 2</code></pre>
|
||||
|
||||
<p>Yields this kind of image border:</p>
|
||||
|
||||
<p class="images"><img src="layout-thumbnails.png"></p>
|
||||
|
||||
|
||||
<h2>Column Headers Properties</h2>
|
||||
|
||||
|
||||
<p>These properties are specific to column headers layout:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewLayoutColumnHeaders.BorderSize</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewLayoutColumnHeaders.SortGlyphPadding</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<p><span class="code">BorderSize</span> defines extent of boundary at the right end
|
||||
of each column header. When mouse cursor hovers over this boundary, the
|
||||
column header can be resized.</p>
|
||||
|
||||
<p><span class="code">SortGlyphPadding</span> is the spacing around sort glyph,
|
||||
which is displayed when the column header is sorted. It is displayed as an
|
||||
arrow pointing upwards or downwards (dependind on sort order). When visual
|
||||
style can be used, this glyph is located in the top part of column header.
|
||||
It is located in the right part, otherwise.</p>
|
||||
|
||||
|
||||
<h2>Group Properties</h2>
|
||||
|
||||
|
||||
<p>There is only one property specific to group layout, which is
|
||||
<span class="code">BetterListViewLayoutGroups.MinimumSize</span>. This is a minimum
|
||||
allowed size of a group. For vertically oriented groups, only height
|
||||
dimension is taken into account.</p>
|
||||
|
||||
<p>Layout of vertically oriented groups supports also
|
||||
<span class="code">BetterListViewLayoutGroupsVertical.ExpandButtonPadding</span>
|
||||
property. This is a spacing around group expand button.</p>
|
||||
|
||||
|
||||
<h2>Common Properties</h2>
|
||||
|
||||
|
||||
<p>All the layouts share following properties:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewLayout.ElementInnerPadding</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewLayout.ElementOuterPadding</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewLayout.LayoutPadding</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>Each element has inner padding specified by
|
||||
<span class="code">ElementInnerPadding</span>, which is a distance between element
|
||||
boundary and its content. These is also outer padding specified by
|
||||
<span class="code">ElementOuterPadding</span>, which is a distance between
|
||||
elements.</p>
|
||||
|
||||
<p>Whole layout has also a padding specified by
|
||||
<span class="code">LayoutPadding</span>. This is a distance between elements and its
|
||||
containing area (control or group).</p>
|
||||
|
||||
<p>Following image shows different areas with and without
|
||||
paddings:</p>
|
||||
|
||||
<p class="images"><img src="layout-padding.png"></p>
|
||||
|
||||
|
||||
<h2>Centering Items in LargeIcon and Thumbnails View</h2>
|
||||
|
||||
|
||||
<p>Earch row of items in LargeIcon and Thumbnails view can be aligned
|
||||
either to the left or to center of the client area. This can be done using
|
||||
Center property of the corresponding layout (LayoutItemsLargeIcon.Center
|
||||
or LayoutItemsThumbnails.Center). The following images show how items are
|
||||
aligned when the Center property is set to true and false:</p>
|
||||
|
||||
<p class="images"><img src="layout-center1.png"><img src="layout-center2.png"></p>
|
||||
|
||||
|
||||
<h2>Sample Source Code</h2>
|
||||
|
||||
|
||||
<p>The following sample shows setting up Better ListView to display
|
||||
multi-line items in <strong><em>Details</em></strong> view stretched to width
|
||||
of a client area (because there are no columns added):</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">this.listView.BeginUpdate();
|
||||
|
||||
this.listView.Items.AddRange(
|
||||
new[]
|
||||
{
|
||||
"Item label can be split in several lines defined by MaximumTextLines property of layout class corresponding to current View.",
|
||||
"All text trimming methods also works with multi-line items. When some items cannot be split to more lines, trimming with additional ellipsis can be used."
|
||||
});
|
||||
|
||||
// resize items in Details view with content to show how the text breaks
|
||||
// other way would be to add column and see text breaking when resizing the column
|
||||
this.listView.AutoSizeItemsInDetailsView = true;
|
||||
|
||||
// enable multi-line items by settings maximum allowed text lines to a number larger than 1
|
||||
this.listView.LayoutItemsDetails.MaximumTextLines = 4; //NOTE: we can also use LayoutItemsCurrent for the view currently set
|
||||
|
||||
this.listView.EndUpdate();</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">ListView.Items.AddRange (
|
||||
New String() { _
|
||||
"Item label can be split in several lines defined by MaximumTextLines property of layout class corresponding to current View.",
|
||||
"All text trimming methods also works with multi-line items. When some items cannot be split to more lines, trimming with additional ellipsis can be used."
|
||||
})
|
||||
|
||||
' resize items in Details view with content to show how the text breaks
|
||||
' other way would be to add column and see text breaking when resizing the column
|
||||
ListView.AutoSizeItemsInDetailsView = True
|
||||
|
||||
' enable multi-line items by settings maximum allowed text lines to a number larger than 1
|
||||
ListView.LayoutItemsDetails.MaximumTextLines = 4
|
||||
'NOTE: we can also use LayoutItemsCurrent for the view currently set
|
||||
ListView.EndUpdate()</code></pre>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-label-edit.html"><strong>
|
||||
« Label Editing</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-multi-line.html"><strong>Multi-line Items »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,145 @@
|
||||
<!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>Multi-line Items</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-layout.html"><strong>
|
||||
« Layout Properties</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-owner-draw.html"><strong>Owner Drawing »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Multi-line Items</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<br><hr>
|
||||
<p class="note">Multi-line items are not supported in <strong><em>Better ListView
|
||||
Express</em></strong>.</p>
|
||||
<hr>
|
||||
<br><h2>Setting Up Multi-line Items and Column Headers</h2>
|
||||
|
||||
|
||||
<p>Better ListView holds a property called
|
||||
<span class="code">MaximumTextLines</span> for each view. This property specifies
|
||||
maximum number of lines that can be displayed in column header, item or
|
||||
sub-item. You can access this property via the corresponding
|
||||
layout:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">LayoutColumns</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">LayoutItemsCurrent</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">LayoutItemsLargeIcon</span>, <span class="code">LayoutItemsList</span>,
|
||||
etc.</p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>For example, if you set <span class="code">LayoutColumns.MaximumTextLines</span>
|
||||
and <span class="code">LayoutItemsDetailsColumns.MaximumTextLines</span> to
|
||||
<span class="code">3</span>, the items and sub-items in the
|
||||
<strong><em>Details</em></strong> view with columns will have up to three
|
||||
lines:</p>
|
||||
|
||||
<p class="images"><img src="layout-multiline1.png"><img src="layout-multiline2.png"></p>
|
||||
|
||||
<p>You can also specifiy maximum allowed number of text lines for a
|
||||
(sub)item by setting one of the following properties:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewItems.MaximumTextLines</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewSubItem.MaximumTextLines</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<h2>Multi-line Groups</h2>
|
||||
|
||||
|
||||
<p>Groups can contain multi-line text as well.</p>
|
||||
|
||||
<p>However, group layouts do not have a <span class="code">MaximumTextLines</span>
|
||||
property because there are no text wrapping options available. When group
|
||||
gets too short, each line of the text gets trimmed separately (this works
|
||||
the same way for items, when <span class="code">TextWrapping</span> property is set to
|
||||
<span class="code">None</span> and item contains multi-line text. See <strong><em><a href="chapter-multi-line.html#adjusting-text-wrapping">Adjusting Text
|
||||
Wrapping</a></em></strong>):</p>
|
||||
|
||||
<p class="images"><img src="multi-line-groups.png"></p>
|
||||
|
||||
|
||||
<h2>Text with Newline Characters</h2>
|
||||
|
||||
|
||||
<p>Better ListView supports text with multiple lines by default. Better
|
||||
ListView recognizes <strong><em>LF</em></strong> characters as newlines, while
|
||||
ingoring the <strong><em>CR</em></strong> characters, so you can use either
|
||||
<strong><em>LF</em></strong> or <strong><em>CRLF</em></strong> as a newline
|
||||
mark.</p>
|
||||
|
||||
<p>By default, only the first line of the text is displayed, so set the
|
||||
<span class="code">MaximumTextLines</span> property to a number of lines you wish to
|
||||
display.</p>
|
||||
|
||||
|
||||
<h2>
|
||||
<a name="adjusting-text-wrapping" id="adjusting-text-wrapping"></a>Adjusting Text
|
||||
Wrapping</h2>
|
||||
|
||||
|
||||
<p>Multi-line items gets higher when more space is needed for more
|
||||
lines. Item height is controlled by the MaximumTextLines property, but you
|
||||
may want to keep some sub-items on single line (e.g. sub-item displaying
|
||||
date), or wrap the text, but only in the available space:</p>
|
||||
|
||||
<p class="images"><img src="text-formatting-wrap.png"></p>
|
||||
|
||||
<p>To control text wrapping behavior, use the
|
||||
<span class="code">BetterListViewSubItem.TextWrapping</span> (or
|
||||
<span class="code">BetterListViewItem.TextWrapping</span>) property. See <strong><em><a href="chapter-text-formatting.html#text-wrapping">Text
|
||||
Wrapping</a></em></strong> for more informaton.</p>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-layout.html"><strong>
|
||||
« Layout Properties</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-owner-draw.html"><strong>Owner Drawing »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,329 @@
|
||||
<!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>Owner Drawing</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-multi-line.html"><strong>
|
||||
« Multi-line Items</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-performance.html"><strong>Performance »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Owner Drawing</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<p>Owner drawing allow to customize appearance of any element, element
|
||||
part and the control itself:</p>
|
||||
|
||||
<p class="images"><img src="owner-draw.png"></p>
|
||||
|
||||
<h2>Drawing Over Control Parts</h2>
|
||||
|
||||
|
||||
<p>The simple way to draw over control parts is by using drawing
|
||||
events:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">DrawBackground</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">DrawColumnHeader</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">DrawColumnHeaderBackground</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">DrawGroup</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">DrawGroupBackground</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">DrawItem</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">DrawItemBackground</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>Each of these events contains <span class="code">System.Drawing.Graphics</span>
|
||||
object in event data with which custom drawing is possible. Areas of
|
||||
drawing are also provided. For example, to draw inside item inner area,
|
||||
there is a
|
||||
<span class="code">BetterListViewDrawItemEventArgs.ItemBounds.BoundsInner</span>
|
||||
property containing the rectangle.</p>
|
||||
|
||||
<br><hr>
|
||||
<p class="note">If you want to paint outside element areas, set
|
||||
<span class="code">OptimizedInvalidation</span> property to <span class="code">false</span>. This
|
||||
will ensure your custom drawing code will be called in every redraw
|
||||
cycle.</p>
|
||||
<hr>
|
||||
<br><h2>Replacing Default Drawing by Custom Drawing</h2>
|
||||
|
||||
|
||||
<p>Owner drawing events are always called after the default drawing, so
|
||||
it is possible only to draw over exisiting drawing. When you need turn off
|
||||
some painting and do your own drawing instead of the default one (e.g.
|
||||
draw rotated text instead the straight one), you have to create your
|
||||
custom control inheriting from <span class="code">BetterListView</span>:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">class OwnerDrawBetterListView : BetterListView
|
||||
{
|
||||
// ...
|
||||
}</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">Class OwnerDrawBetterListView Inherits BetterListView
|
||||
' ...
|
||||
End Class</code></pre>
|
||||
|
||||
<p>Then you can override one of the drawing methods:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">OnDrawBackground</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">OnDrawColumnHeader</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">OnDrawGroup</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">OnDrawGroupBackground</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">OnDrawItem</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">OnDrawItemBackground</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>This gives you more control over the painting, because your drawing
|
||||
code can be called <strong><em>before</em></strong> or
|
||||
<strong><em>after</em></strong> the default drawing, depending on where and if
|
||||
you call base implementation.</p>
|
||||
|
||||
<p>Every part of the default drawing has a switch so you can turn the
|
||||
default drawing off. For example, if you want not to draw default text on
|
||||
some item, set <span class="code">BetterListViewDrawItemEventArgs.DrawText</span>
|
||||
property to <span class="code">false</span>.</p>
|
||||
|
||||
<p>It is also possible to do custom drawing as the very last drawing of
|
||||
the whole control. To do this, override <span class="code">DrawingRedrawCore</span>
|
||||
method and do your drawing after calling the base implementation:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">protected override void DrawingRedrawCore(Graphics grfx)
|
||||
{
|
||||
base.DrawingRedrawCore(grfx);
|
||||
|
||||
// do your custom drawing
|
||||
}</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">Protected Overrides Sub DrawingRedrawCore(grfx As Graphics)
|
||||
|
||||
MyBase.DrawingRedrawCore(grfx)
|
||||
|
||||
' do your custom drawing
|
||||
|
||||
End Sub</code></pre>
|
||||
|
||||
|
||||
<h2>Overriding Item and Control States</h2>
|
||||
|
||||
|
||||
<p>The appearance of element depends not only on its state, but also on
|
||||
the control state.</p>
|
||||
|
||||
<p>If you override one of the drawing methods (e.g.
|
||||
<span class="code">OnDrawItem</span>), you can modify event data before calling base
|
||||
class implementation (e.g. <span class="code">base.OnDrawItem</span>).</p>
|
||||
|
||||
<p>For example, <span class="code">BetterListViewDrawItemEventArgs</span> contains
|
||||
<span class="code">ItemStateInfo</span> property. By modifying this property, you can
|
||||
force drawing item in any state you wish.</p>
|
||||
|
||||
<p><span class="code">BetterListViewDrawItemEventArgs</span> also contains two
|
||||
properties regarding control state:</p>
|
||||
|
||||
<ul style="list-style:none">
|
||||
<li>
|
||||
<span class="code">DrawEnabled</span><ul style="list-style:none"><li>
|
||||
<p>Draw item as if the control is in enabled state
|
||||
(<span class="code">BetterListView.Enabled</span> is <span class="code">true</span>).</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">DrawFocused</span><ul style="list-style:none"><li>
|
||||
<p>Draw item as if the control in in focused state
|
||||
(<span class="code">BetterListView.Focused</span> is <span class="code">true</span>).</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
</ul>
|
||||
<p>By default, these properties correspond to actual control's state,
|
||||
but they can be modified. For example, one may want to set
|
||||
<span class="code">DrawFocused</span> to true on every item that is selected, so the
|
||||
item will be highlighted even if the control loses focus.</p>
|
||||
|
||||
<p>The control state properties are available only in the
|
||||
<span class="code">BetterListViewItemEventArgs</span>, but element states can be
|
||||
modified in all painting event handlers (also column headers and
|
||||
groups).</p>
|
||||
|
||||
|
||||
<h2>Sample Source Code</h2>
|
||||
|
||||
|
||||
<p>The following sample shows owner drawing of item background:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">this.listView.BeginUpdate();
|
||||
|
||||
this.listView.Items.Add("Item with owner-drawn image and background.");
|
||||
|
||||
this.listView.View = BetterListViewView.Tile;
|
||||
// turn off automatic image sizing to make space for image even when items do not have any images set
|
||||
this.listView.LayoutOptions = (BetterListViewLayoutOptions.Auto & ~BetterListViewLayoutOptions.AutoSizeItemImage);
|
||||
// set 4-pixel boundary around image
|
||||
this.listView.LayoutItemsCurrent.ImagePadding = new Padding(4);
|
||||
// set image size to be 50 by 50 pixels (it is possible to set image sizes for sub-items as well by adding more Size instances in the collection)
|
||||
this.listView.LayoutItemsCurrent.ImageSizes = new ReadOnlyCollection<Size>(new[] { new Size(50, 50) });
|
||||
|
||||
this.listView.EndUpdate();
|
||||
|
||||
// we would like to draw over item's foreground (custom image)
|
||||
this.listView.DrawItem += ListViewDrawItem;
|
||||
// we would like to draw over item's background
|
||||
this.listView.DrawItemBackground += ListViewDrawItemBackground;</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">ListView.BeginUpdate()
|
||||
|
||||
ListView.Items.Add("Item with owner-drawn image and background.")
|
||||
|
||||
ListView.View = BetterListViewView.Tile
|
||||
' turn off automatic image sizing to make space for image even when items do not have any images set
|
||||
ListView.LayoutOptions = (BetterListViewLayoutOptions.Auto And Not BetterListViewLayoutOptions.AutoSizeItemImage)
|
||||
' set 4-pixel boundary around image
|
||||
ListView.LayoutItemsCurrent.ImagePadding = New Padding(4)
|
||||
' set image size to be 50 by 50 pixels (it is possible to set image sizes for sub-items as well by adding more Size instances in the collection)
|
||||
ListView.LayoutItemsCurrent.ImageSizes = New ReadOnlyCollection(Of Size)(New Size() {New Size(50, 50)})
|
||||
|
||||
ListView.EndUpdate()
|
||||
|
||||
' we would like to draw over item's foreground (custom image)
|
||||
AddHandler ListView.DrawItem, AddressOf ListViewDrawItem
|
||||
' we would like to draw over item's background
|
||||
AddHandler ListView.DrawItemBackground, AddressOf ListViewDrawItemBackground</code></pre>
|
||||
|
||||
<p><span class="code">DrawItem</span> event handler draws on the item image
|
||||
area:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">void ListViewDrawItem(object sender, BetterListViewDrawItemEventArgs eventArgs)
|
||||
{
|
||||
eventArgs.Graphics.SmoothingMode = SmoothingMode.HighQuality;
|
||||
|
||||
Pen pen = new Pen(Color.BlueViolet, 2.5f);
|
||||
|
||||
// draw ellipse in the image area
|
||||
eventArgs.Graphics.DrawEllipse(
|
||||
pen,
|
||||
eventArgs.ItemBounds.SubItemBounds[0].BoundsImage);
|
||||
|
||||
pen.Dispose();
|
||||
}</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">Sub ListViewDrawItem(ByVal sender As Object, ByVal eventArgs As BetterListViewDrawItemEventArgs)
|
||||
|
||||
eventArgs.Graphics.SmoothingMode = SmoothingMode.HighQuality
|
||||
|
||||
Dim pen As New Pen(Color.BlueViolet, 2.5F)
|
||||
|
||||
' draw ellipse in the image area
|
||||
eventArgs.Graphics.DrawEllipse(pen, eventArgs.ItemBounds.SubItemBounds(0).BoundsImage)
|
||||
|
||||
pen.Dispose()
|
||||
|
||||
End Sub</code></pre>
|
||||
|
||||
<p><span class="code">DrawItemBackground</span> event handler draws on the item
|
||||
background area:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">void ListViewDrawItemBackground(object sender, BetterListViewDrawItemBackgroundEventArgs eventArgs)
|
||||
{
|
||||
Brush brush = new LinearGradientBrush(
|
||||
eventArgs.ItemBounds.BoundsInner,
|
||||
Color.FromArgb(64, Color.DarkSeaGreen),
|
||||
Color.Transparent,
|
||||
LinearGradientMode.ForwardDiagonal);
|
||||
|
||||
// draw over the item's background in the inner area
|
||||
eventArgs.Graphics.FillRectangle(brush, eventArgs.ItemBounds.BoundsInner);
|
||||
|
||||
brush.Dispose();
|
||||
}</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">Sub ListViewDrawItemBackground(ByVal sender As Object, ByVal eventArgs As BetterListViewDrawItemBackgroundEventArgs)
|
||||
|
||||
Dim brush As Brush = New LinearGradientBrush(
|
||||
eventArgs.ItemBounds.BoundsInner,
|
||||
Color.FromArgb(64, Color.DarkSeaGreen),
|
||||
Color.Transparent,
|
||||
LinearGradientMode.ForwardDiagonal)
|
||||
|
||||
' draw over the item's background in the inner area
|
||||
eventArgs.Graphics.FillRectangle(brush, eventArgs.ItemBounds.BoundsInner)
|
||||
|
||||
brush.Dispose()
|
||||
|
||||
End Sub</code></pre>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-multi-line.html"><strong>
|
||||
« Multi-line Items</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-performance.html"><strong>Performance »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,267 @@
|
||||
<!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>Performance</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-owner-draw.html"><strong>
|
||||
« Owner Drawing</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-save-load.html"><strong>Saving and Loading ListView Content »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Performance</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<h2>Using BeginUpdate / EndUpdate Methods</h2>
|
||||
|
||||
|
||||
<p>When doing several operations with Better ListView at a time, these
|
||||
operations should be enclosed in BeginUpdate and EndUpdate method
|
||||
calls.</p>
|
||||
|
||||
<p>For example:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">listView.BeginUpdate();
|
||||
|
||||
for (int i = 0; i < 100; i++)
|
||||
{
|
||||
listView.Items.Add(String.Format("Item no. {0}", i));
|
||||
}
|
||||
|
||||
listView.EndUpdate();</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">ListView.BeginUpdate()
|
||||
|
||||
For i As Integer = 0 To 99
|
||||
ListView.Items.Add([String].Format("Item no. {0}", i))
|
||||
Next
|
||||
|
||||
listView.EndUpdate()</code></pre>
|
||||
|
||||
<p>Without these methods, Better ListView would refresh itself 100
|
||||
times and the whole operation would take noticeable time. The same applies
|
||||
to setting properties or modifying other collections (column headers,
|
||||
sub-items, child items, groups) so it is still convenient to use
|
||||
<span class="code">BeginUpdate</span> and <span class="code">EndUpdate</span> when setting multiple
|
||||
properties:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">BeginUpdate();
|
||||
|
||||
listView.Items[0].SubItems[1].Align = TextAlignment.Right;
|
||||
|
||||
listView.MultiSelect = true;
|
||||
listView.CheckBoxes = BetterListViewCheckBoxes.TwoState;
|
||||
|
||||
EndUpdate();</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">BeginUpdate()
|
||||
|
||||
ListView.Items(0).SubItems(1).Align = TextAlignment.Right
|
||||
|
||||
ListView.MultiSelect = True
|
||||
ListView.CheckBoxes = BetterListViewCheckBoxes.TwoState
|
||||
|
||||
EndUpdate()</code></pre>
|
||||
|
||||
<p>There can be multiple calls of <span class="code">BeginUpdate</span> and the
|
||||
control will actually refresh after the same number of
|
||||
<span class="code">EndUpdate</span> calls are made.</p>
|
||||
|
||||
<p>It is also possible to call <span class="code">EndUpdate</span> with boolean
|
||||
parameter. The call <span class="code">EndUpdate(true)</span> will avoid refreshing the
|
||||
control, but still move the control out of the updation state.</p>
|
||||
|
||||
<p>To check whether the control is in updation state, use the
|
||||
<span class="code">IsUpdating</span> property:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">// intentionally call BeginUpdate twice
|
||||
BeginUpdate();
|
||||
BeginUpdate();
|
||||
|
||||
// listView.IsUpdating is true
|
||||
|
||||
EndUpdate();
|
||||
|
||||
// still updating, listView.IsUpdating is true
|
||||
|
||||
EndUpdate();
|
||||
|
||||
// still updating, listView.IsUpdating is false</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">' intentionally call BeginUpdate twice
|
||||
BeginUpdate()
|
||||
BeginUpdate()
|
||||
|
||||
' listView.IsUpdating is true
|
||||
|
||||
EndUpdate()
|
||||
|
||||
' still updating, listView.IsUpdating is true
|
||||
|
||||
EndUpdate()
|
||||
|
||||
' still updating, listView.IsUpdating is false</code></pre>
|
||||
|
||||
|
||||
<h2>Performance Properties</h2>
|
||||
|
||||
|
||||
<p>Better ListView was designed to be responsive to user although it is
|
||||
quite complex control. It is sometimes convenient to adjust optimization
|
||||
settings. This can be done through the following properties:</p>
|
||||
|
||||
<ul style="list-style:none">
|
||||
<li>
|
||||
<span class="code">BetterListView.AutoSizeItemsInDetailsView</span><ul style="list-style:none"><li>
|
||||
<p><span class="code">false</span> by default</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">BetterListView.CacheImages</span><ul style="list-style:none"><li>
|
||||
<p><span class="code">true</span> by default</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">BetterListView.OptimizedInvalidation</span><ul style="list-style:none"><li>
|
||||
<p><span class="code">true</span> by default</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">BetterListViewColumnHeader.SmoothColumnResize</span><ul style="list-style:none"><li>
|
||||
<p><span class="code">true</span> by default. Can be set on each column header
|
||||
separately.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">BetterListView.SortOnCollectionChange</span><ul style="list-style:none"><li>
|
||||
<p><span class="code">true</span> by default</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
</ul>
|
||||
<h2>Automatic Resizing of Items in Details View</h2>
|
||||
|
||||
|
||||
<p>Better ListView supports displaying items in
|
||||
<strong><em>Details</em></strong> view even when there are no columns. When
|
||||
columns are displayed, item width is determined by the total width of all
|
||||
columns. When columns are not present, items have fixed width by default.
|
||||
By settings <span class="code">AutoSizeItemsInDetailsView</span> property to
|
||||
<span class="code">true</span>, items will be always stretched to client area width.
|
||||
The following images shows item size without and with automatic
|
||||
resizing:</p>
|
||||
|
||||
<p class="images"><img src="performance-autosizeitemsindetailsview1.png"></p>
|
||||
|
||||
<p class="images"><img src="performance-autosizeitemsindetailsview2.png"></p>
|
||||
|
||||
<p>Items are not resized by default, because it slows performance when
|
||||
Better ListView contains huge number of items.</p>
|
||||
|
||||
|
||||
<h2>Image Caching</h2>
|
||||
|
||||
|
||||
<p>When Better ListView contains images of various sizes which are
|
||||
possibly downscaled, its performance can drop. Showing image frames and
|
||||
shadows can slow down redrawing of the control even more. When
|
||||
<span class="code">CacheImages</span> property is set to <span class="code">true</span>, Better
|
||||
ListView downscales every image just once and then stores the scaled image
|
||||
(also with its frame) to internal cache. The scaled image is then
|
||||
displayed quickly.</p>
|
||||
|
||||
<p>The cache is cleared whenever an item property si changed affecting
|
||||
image or its border.</p>
|
||||
|
||||
|
||||
<h2>Optimized Invalidation</h2>
|
||||
|
||||
|
||||
<p>When user moves mouse cursor over the control, not all the elements
|
||||
have to be redrawn. For example, when user moves mouse cursor from column
|
||||
header A to item B, hot state of these elements changes and only these two
|
||||
elements are be redrawn. Optimized invalidation finds always the smallest
|
||||
region to redraw.</p>
|
||||
|
||||
<p>This behavior is used when <span class="code">OptimizedInvalidation</span>
|
||||
property is set to <span class="code">true</span>. This behavior can be sometimes
|
||||
unwanted, e.g. on some specific <strong><em><a href="chapter-owner-draw.html">Owner drawing</a></em></strong>.</p>
|
||||
|
||||
|
||||
<h2>Smooth Column Resizing</h2>
|
||||
|
||||
|
||||
<p>When columns are resized in <strong><em>Details</em></strong> view, the
|
||||
items and sub-items are resized as well. Item resizing may pose a
|
||||
performance bottleneck, when there are huge number of items present and
|
||||
column resizing animation may not be smooth. It is possible to set
|
||||
<span class="code">BetterListViewColumnHeader.SmoothColumnResize</span> property to
|
||||
<span class="code">false</span>, which will cause items and sub-items in the specific
|
||||
column to be resized only once: when column resizing is finished (e.g.
|
||||
when user releases mouse button).</p>
|
||||
|
||||
<p>When the smooth column resizing feature is turned off, a line is
|
||||
displayed that shows new column width:</p>
|
||||
|
||||
<p class="images"><img src="performance-smoothcolumnresize.png"></p>
|
||||
|
||||
|
||||
<h2>Sorting on Collection Change</h2>
|
||||
|
||||
|
||||
<p>When the Better ListView is sorted and its content is changed, it
|
||||
keeps sort order by default. This needs, however, to re-sort all the items
|
||||
whenever there is some change.</p>
|
||||
|
||||
<p>This behavior can be turned off by settings
|
||||
<span class="code">SortOnCollectionChanged</span> property to <span class="code">false</span>. In
|
||||
that case, Better ListView does not guarantee that the Items collection is
|
||||
always sorted and you have to perform sorting manually, when
|
||||
needed.</p>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-owner-draw.html"><strong>
|
||||
« Owner Drawing</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-save-load.html"><strong>Saving and Loading ListView Content »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,153 @@
|
||||
<!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>Saving and Loading ListView Content</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-performance.html"><strong>
|
||||
« Performance</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-search.html"><strong>Searching Items »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Saving and Loading ListView Content</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<br><hr>
|
||||
<p class="note">Saving and Loading ListView content is not supported in
|
||||
<strong><em>Better ListView Express</em></strong>.</p>
|
||||
<hr>
|
||||
<br><p>Better ListView provides methods for storing its content (items with
|
||||
columns and groups) in a file or stream:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">SaveContentBinary(string filename)</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">SaveContentBinary(Stream stream)</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">SaveContentXml(string filename)</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">SaveContentXml(XmlWriter writer)</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>Analogically, there are methods to retrieving the stored content
|
||||
back:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">LoadContentBinary(string filename)</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">LoadContentBinary(Stream stream)</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">LoadContentXml(string filename)</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">LoadContentXml(XmlReader reader)</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>Storing Better ListView content in a file is very easy. The Following
|
||||
sample shows storing the content in a binary file:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">// save Better ListView items, columns and groups in a XML file
|
||||
this.listView.SaveContentBinary("listview-content.dat");
|
||||
|
||||
// clear content to ensure it is loaded back correctly
|
||||
this.listView.Clear();
|
||||
|
||||
// restore content from file
|
||||
this.listView.LoadContentBinary("listview-content.dat");</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">' save Better ListView items, columns and groups in a XML file
|
||||
ListView.SaveContentBinary("listview-content.dat")
|
||||
|
||||
' clear content to ensure it is loaded back correctly
|
||||
ListView.Clear()
|
||||
|
||||
' restore content from file
|
||||
ListView.LoadContentBinary("listview-content.dat")</code></pre>
|
||||
|
||||
<p>The content can be stored in either binary or XML format. For example,
|
||||
to store the content in a stream as formatted XML, use the following
|
||||
code:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">XmlTextWriter writer = new XmlTextWriter(stream, Encoding.UTF8);
|
||||
|
||||
writer.Formatting = Formatting.Indented;
|
||||
|
||||
listView.SaveContentXml(writer);
|
||||
|
||||
writer.Close();</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">Dim writer As New XmlTextWriter(stream, Encoding.UTF8)
|
||||
|
||||
writer.Formatting = Formatting.Indented
|
||||
|
||||
listView.SaveContentXml(writer)
|
||||
|
||||
writer.Close()</code></pre>
|
||||
|
||||
<p>Note that in this case it is necessary to have
|
||||
<span class="code">XmlTextReader.WhitespaceHandling</span> property set to
|
||||
<span class="code">None</span> when loading content from formatted XML stream because
|
||||
white spaces need to be skipped during the deserialization process.</p>
|
||||
|
||||
<p>Standard <strong><em><a href="chapter-serialization.html">Serialization</a></em></strong> mechanisms are
|
||||
used to store elements and its properties. The methods named above store
|
||||
also mapping between items and their corresponding groups. This cannot be
|
||||
done when simply serializing <span class="code">Groups</span> or <span class="code">Items</span>
|
||||
collection.</p>
|
||||
|
||||
<br><hr>
|
||||
<p class="note">When content is loaded into Better ListView, the current content is
|
||||
cleared.</p>
|
||||
<hr>
|
||||
<br><br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-performance.html"><strong>
|
||||
« Performance</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-search.html"><strong>Searching Items »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,239 @@
|
||||
<!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>Searching Items</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-save-load.html"><strong>
|
||||
« Saving and Loading ListView Content</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-serialization.html"><strong>Serialization »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Searching Items</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<p>Better ListView offers many options for searching items by typing on
|
||||
keyboard and programmaticaly (<span class="code">FindItemWithText</span>,
|
||||
<span class="code">FindItemsWithText</span> methods). Search can be extended to sub-items
|
||||
and event multiple items can be contained in a search result.</p>
|
||||
|
||||
<p>Search can be customized with <span class="code">SearchSettings</span> property.
|
||||
This structure contains three other properties:</p>
|
||||
|
||||
<ul style="list-style:none">
|
||||
<li>
|
||||
<span class="code">Mode</span><ul style="list-style:none"><li>
|
||||
<p>Specifies how the searching is done on each item/sub-item
|
||||
string.</p>
|
||||
|
||||
<ul style="list-style:none">
|
||||
<li>
|
||||
<span class="code">Disabled</span><ul style="list-style:none"><li>
|
||||
<p>Searching is disabled.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">Prefix</span><ul style="list-style:none"><li>
|
||||
<p>Search is restricted to text prefix.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">PrefixOrSubstring</span><ul style="list-style:none"><li>
|
||||
<p>Search query can match any substring, if nothing found by
|
||||
prefix.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">Substring</span><ul style="list-style:none"><li>
|
||||
<p>Search query can match any substring.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">Options</span><ul style="list-style:none"><li>
|
||||
<p>Additional options for searching.</p>
|
||||
|
||||
<ul style="list-style:none">
|
||||
<li>
|
||||
<span class="code">CaseSensitive</span><ul style="list-style:none"><li>
|
||||
<p>The search is case-sensitive.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">FirstWordOnly</span><ul style="list-style:none"><li>
|
||||
<p>Search is restricted to the first word of searched
|
||||
text.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">None</span><ul style="list-style:none"><li>
|
||||
<p>No options active.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">PlaySound</span><ul style="list-style:none"><li>
|
||||
<p>Sound is played, when nothing is found.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">PrefixPreference</span><ul style="list-style:none"><li>
|
||||
<p>Results matched by prefix are prefered among other (e.g.
|
||||
when searching for <strong><em>pla</em></strong>, then the text
|
||||
<strong><em>player</em></strong> is prefered among the word
|
||||
<strong><em>applause</em></strong>).</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">SelectableItemsOnly</span><ul style="list-style:none"><li>
|
||||
<p>Restrict the search to selectable items only.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">WordSearch </span><ul style="list-style:none"><li>
|
||||
<p>Searched text si first split into words and searching is
|
||||
done on each word separately.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
</ul>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">SubItemIndices</span><ul style="list-style:none"><li>
|
||||
<p>Specifies sub-items on which the search is done; if the
|
||||
collection is empty, than all sub-items are searched.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
</ul>
|
||||
<p>There is a default one-second delay to register when user stopped
|
||||
typing and the search is discarded. A new search is initiated when user
|
||||
starts typing after this interval has passed. This interval can be set via
|
||||
<span class="code">SearchTimeoutDelay</span> property.</p>
|
||||
|
||||
<p>The delay is not relevant when user types the same letter several
|
||||
times and there are other items beginning with that letter. If there are
|
||||
items named <strong><em>ab</em></strong>, <strong><em>ac</em></strong>,
|
||||
<strong><em>ad</em></strong>, then the selection cycles through these items as
|
||||
long as the user keeps pressing <strong><em>A</em></strong> key. This works
|
||||
essentialy the same way as in the Windows Explorer.</p>
|
||||
|
||||
<br><hr>
|
||||
<p class="note">The keyboard search works, of course, only when the control has
|
||||
focus. You can ensure this (e.g. when showing the form) by calling
|
||||
<span class="code">Focus</span> method on Better ListView.</p>
|
||||
<hr>
|
||||
<br><h2>Sample Source Code</h2>
|
||||
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">this.listView.BeginUpdate();
|
||||
|
||||
// fill the ListView with items in two columns
|
||||
this.listView.Columns.AddRange(
|
||||
new[]
|
||||
{
|
||||
new BetterListViewColumnHeader("Word", 128),
|
||||
new BetterListViewColumnHeader("Synonym List", 160)
|
||||
});
|
||||
|
||||
this.listView.Items.AddRange(
|
||||
new[]
|
||||
{
|
||||
new BetterListViewItem(new[] { "apparently", "evidently, presumably, seemingly" }),
|
||||
new BetterListViewItem(new[] { "blunt", "brusque, curt, snippy" }),
|
||||
new BetterListViewItem(new[] { "class", "caste, estate, folk" }),
|
||||
new BetterListViewItem(new[] { "detailed", "elaborate, full, thorough" }),
|
||||
});
|
||||
|
||||
// search in substrings
|
||||
BetterListViewSearchMode searchMode = BetterListViewSearchMode.Substring;
|
||||
|
||||
// use case-sensitive searching and play sounds
|
||||
BetterListViewSearchOptions searchOptions = (BetterListViewSearchOptions.CaseSensitive | BetterListViewSearchOptions.PlaySound);
|
||||
|
||||
// search in the first and second column
|
||||
//NOTE: empty array also means searching in all columns
|
||||
int[] subItemIndices = new[] { 0, 1 };
|
||||
|
||||
// set-up the search
|
||||
this.listView.SearchSettings = new BetterListViewSearchSettings(searchMode, searchOptions, subItemIndices);
|
||||
|
||||
this.listView.EndUpdate();</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">ListView.BeginUpdate()
|
||||
|
||||
' fill the ListView with items in two columns
|
||||
ListView.Columns.AddRange(
|
||||
New BetterListViewColumnHeader() { _
|
||||
New BetterListViewColumnHeader("Word", 128),
|
||||
New BetterListViewColumnHeader("Synonym List", 160)
|
||||
})
|
||||
|
||||
ListView.Items.AddRange(
|
||||
New BetterListViewItem() { _
|
||||
New BetterListViewItem(New String() _
|
||||
{"apparently", "evidently, presumably, seemingly"}),
|
||||
New BetterListViewItem(New String() {"blunt", "brusque, curt, snippy"}),
|
||||
New BetterListViewItem(New String() {"class", "caste, estate, folk"}),
|
||||
New BetterListViewItem(New String() {"detailed", "elaborate, full, thorough"})
|
||||
})
|
||||
|
||||
' search in substrings
|
||||
Dim searchMode As BetterListViewSearchMode = BetterListViewSearchMode.Substring
|
||||
|
||||
' use case-sensitive searching and play sounds
|
||||
Dim searchOptions As BetterListViewSearchOptions =
|
||||
(BetterListViewSearchOptions.CaseSensitive Or BetterListViewSearchOptions.PlaySound)
|
||||
|
||||
' search in the first and second column
|
||||
'NOTE: empty array also means searching in all columns
|
||||
Dim subItemIndices As Integer() = New Integer() {0, 1}
|
||||
|
||||
' set-up the search
|
||||
ListView.SearchSettings = New BetterListViewSearchSettings (searchMode, searchOptions, subItemIndices)
|
||||
|
||||
ListView.EndUpdate()</code></pre>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-save-load.html"><strong>
|
||||
« Saving and Loading ListView Content</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-serialization.html"><strong>Serialization »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,580 @@
|
||||
<!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:fb="http://www.facebook.com/2008/fbml" xml:lang="en" lang="en">
|
||||
<head>
|
||||
<!-- Google Tag Manager -->
|
||||
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
|
||||
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
|
||||
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
|
||||
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
|
||||
})(window,document,'script','dataLayer','GTM-TMSFLB4');</script>
|
||||
<!-- End Google Tag Manager -->
|
||||
<script>
|
||||
function gainit()
|
||||
{
|
||||
ga('create', 'UA-16362539-4', 'auto');
|
||||
console.log('ga init');
|
||||
}
|
||||
window.onload=gainit;
|
||||
</script>
|
||||
<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
|
||||
<meta name="keywords" content="better listview, list view, listview, list view control, list view component, .net list view, list view replacement, list view alternative, improved list view, enhanced list view" />
|
||||
<meta name="description" content="Better ListView is an alternative List View control - the ideal replacement for the regular .NET listview component. For WinForms C#/VB.net." />
|
||||
<meta name="author" content="ComponentOwl" />
|
||||
<meta http-equiv="Title" content="Better ListView for .NET (C#, VB) - Alternative list view component" />
|
||||
<meta name="copyright" content="(c) 2010-2018 ComponentOwl" />
|
||||
<meta name="distribution" content="Global" />
|
||||
<meta name="rating" content="General" />
|
||||
<meta name="robots" content="All" />
|
||||
<meta http-equiv="Content-Language" content="en" />
|
||||
<meta name="verify-v1" content="NK0H1gWia1vxGZ2Yhr59gsS0/P2/USBI1DVA18VkzjM=" />
|
||||
<meta name="google-site-verification" content="O7Dwtzu5x_Mob9u98uxqpZ-_wCLGpEkx2IL0UYVQ4ac" />
|
||||
<title>Better ListView for .NET (C#, VB) - Alternative list view component</title>
|
||||
<link rel="alternate" type="application/rss+xml" title="Component Owl Feed: Latest releases, news and tips & tricks from our blog" href="../../../feeds.rss" />
|
||||
<link rel="alternate" type="application/rss+xml" title="Component Owl's Comics: Latest comic strips for developers by Libor Tinka" href="../../../comics.rss" />
|
||||
<link href="../../../stylesheets/base_packaged.css%3F1455269822.css" media="screen" rel="stylesheet" type="text/css" />
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<!-- Google Tag Manager (noscript) -->
|
||||
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-TMSFLB4"
|
||||
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
|
||||
<!-- End Google Tag Manager (noscript) -->
|
||||
<div class="d-page">
|
||||
|
||||
<div class="d-header d-placing">
|
||||
|
||||
<ul class="d-menu">
|
||||
<li class=""><a href="../../../index.html" class="menu-item">Home</a></li>
|
||||
<li class="active with-dropdown">
|
||||
<a href="../../../blog/page/6/index.html" class="menu-item">Products</a>
|
||||
<div class="dropdown dropdown-submenu" style="display: none; width: 370px"><div class="outer"><div class="shadowbox"><div class="border"><div class="inner">
|
||||
|
||||
<div class="dropdown-category">WinForms Components</div>
|
||||
|
||||
|
||||
<a href="../../../blog/page/6/index.html" class="featured-item"><img alt="icon" src="http://assets.componentowl.com/icons/better-listview-32-1355160256.png?1355135056" /> Better ListView<br /><span class="subline">Ultimate ListView control for .NET</span></a>
|
||||
|
||||
|
||||
<a href="../../../better-thumbnail-browser.html" class="featured-item"><img alt="icon" src="http://assets.componentowl.com/icons/better-thumbnail-browser-32-1355160281.png?1355135081" /> Better Thumbnail Browser<br /><span class="subline">Thumbnail loading and browsing control for .NET</span></a>
|
||||
|
||||
|
||||
<a href="../../../better-splitbutton.html"><img alt="icon" src="http://assets.componentowl.com/icons/better-splitbutton-32-1355160307.png?1355135107" /> Better SplitButton<br /><span class="subline">Free customizable dropdown button control</span></a>
|
||||
|
||||
|
||||
<a href="../../../better-listview-express.html"><img alt="icon" src="http://assets.componentowl.com/icons/better-listview-express-32-1355160327.png?1355135127" /> Better ListView Express<br /><span class="subline">Free edition with less features</span></a>
|
||||
|
||||
|
||||
</div></div></div></div></div>
|
||||
</li>
|
||||
<li class="">
|
||||
<a href="../../../pricing-licensing/better-listview.html" class="menu-item">Purchase</a>
|
||||
<div class="dropdown dropdown-submenu" style="display: none; width: 330px"><div class="outer"><div class="shadowbox"><div class="border"><div class="inner">
|
||||
|
||||
|
||||
|
||||
<a href="../../../pricing-licensing/better-listview.html" class="featured-item">Better ListView</a>
|
||||
|
||||
|
||||
|
||||
|
||||
<a href="../../../pricing-licensing/better-thumbnail-browser.html" class="featured-item">Better Thumbnail Browser</a>
|
||||
|
||||
|
||||
|
||||
|
||||
<a href="../../../pricing-licensing/better-splitbutton.html">Better SplitButton</a>
|
||||
|
||||
|
||||
|
||||
|
||||
</div></div></div></div></div>
|
||||
</li>
|
||||
<li class=""><a href="../../../support.html" class="menu-item">Support</a></li>
|
||||
<li class=""><a href="../../../articles.html" class="menu-item">Articles</a></li>
|
||||
<li class=""><a href="../../../blog.html" class="menu-item">Blog</a></li>
|
||||
<li class=""><a href="../../../comics/43.html" class="menu-item">Comics</a></li>
|
||||
<li class=""><a href="../../../about-us.html" class="menu-item">About Us</a></li>
|
||||
</ul>
|
||||
<div class="d-logo">
|
||||
<a href="../../../index.html" class="logoimg"><img alt="Component Owl" src="../../../images/componentowl.gif%3F1455269978" /></a>
|
||||
<g:plusone size="medium" count="false" href="http://www.componentowl.com"></g:plusone>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="d-placing">
|
||||
<div class="d-content-wrap">
|
||||
<div class="subpage product-content">
|
||||
<h1>Better ListView: Alternative list view control for .NET</h1>
|
||||
|
||||
<p class="section-info">Ideal .NET WinForms (C#, VB.net) replacement list view component. More features, less limitations, fast and optimized.</p>
|
||||
|
||||
<div class="sides">
|
||||
|
||||
<div class="right">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<input id="tabs-initial-index" name="tabs-initial-index" type="hidden" value="-1" />
|
||||
|
||||
<ul id="nav" class="nav">
|
||||
|
||||
<li><a href="../../../blog/page/6/index.html" class="current">Overview</a></li>
|
||||
|
||||
<li><a href="../../../better-listview/screenshots.html" class="">Screenshots</a></li>
|
||||
|
||||
<li><a href="../../../better-listview/comparison-table.html" class="">Comparison</a></li>
|
||||
|
||||
<li><a href="../../../better-listview/resources.html" class="">Resources</a></li>
|
||||
|
||||
<li><a href="../../../better-listview/story.html" class="">Story</a></li>
|
||||
|
||||
</ul>
|
||||
|
||||
<div id="nav-panel" class="nav-panel product-detail"><div class="features-page">
|
||||
<ul class="common">
|
||||
<li>Better ListView is a <strong>list view control for .NET Windows Forms</strong></li>
|
||||
<li>Designed as a replacement for the regular .NET list view control.</li>
|
||||
<li>Compatible with: Visual Studio 2015, 2013, 2012, 2010, 2008, 2005, with full designer support.</li>
|
||||
<li>For C#, Visual Basic .NET (VB.NET), managed C++, and other CLI languages.</li>
|
||||
<li>Compatible with .NET 4.5, .NET 4, .NET 3.5, .NET 3, .NET 2, and newer. Supports .NET Client Profile.</li>
|
||||
<li>Runs on Windows 10, 8, 7, Vista, 2003, XP, 2000, and newer, both 32-bit and 64-bit.</li>
|
||||
<li>Better ListView has <strong>more features and flexibility</strong>, always uses the <strong>current system theme</strong> (including <strong>Aero</strong> support), and <strong>removes limitations</strong> of the regular .NET list view control.</li>
|
||||
<li><strong>Minimum learning needed</strong>. Better ListView can be used just like the regular list view.</li>
|
||||
<li>Written in <strong>pure managed C# code</strong>. It is fast, <strong>light-weight</strong> and optimized for 10k+ items.</li>
|
||||
<li>Easy royalty-free deployment. Single DLL file that has just 250kB when compressed.</li>
|
||||
<li>The assembly is <strong><a href="http://www.nist.gov/itl/fipsinfo.cfm" target="_blank">FIPS-compliant</a></strong>, CLS-compliant, <strong>digitally signed</strong> and strongly named.</li>
|
||||
<li>Tested in the real world by thousands of users</li>
|
||||
</ul>
|
||||
|
||||
<div class="image"><img alt="Better ListView control" src="http://assets.componentowl.com/images/7/Overview Collage_original_1367470843.png?1367445643" /></div>
|
||||
|
||||
<h2>Extra features summary</h2>
|
||||
|
||||
Better ListView is fast and flicker-free, supports hierarchical items, has improved grouping, better drag & drop and item reordering support, better column headers, inbuilt sorting, multi-column sorting, better images support, context menus for column headers and items, embedded controls for editing support, automatic and custom sizing of items and images, thumbnails view, richer event data, item text formatting, XML and binary serialization, data-binding, owner-drawing options, better tooltips, powerful hit-test, improved usability, easy saving/loading of contents into file or string, multi-line items, and more.
|
||||
|
||||
<div class="testimonial-intext"><div class="testimonial-wrap"><blockquote><em>
|
||||
Component Owl created <b>the one and only tool I don’t want to be without when it comes to software developing in Visual Studio</b>. Also, I’ve been working as software user/developer for the last 26 years, and <b>I have never before experienced a support that really goes the needed extra mile to make things work</b>, like the guys at Component Owl do.
|
||||
</em></blockquote><strong>Göran Alfvén, Sweden</strong></div></div>
|
||||
|
||||
<div class="testimonial-intext"><div class="testimonial-wrap"><blockquote><em>
|
||||
The control is <b>very easy and intuitive to use and is well documented</b>.
|
||||
</em></blockquote><strong>DevProConnections.com Review</strong></div></div>
|
||||
|
||||
<div class="testimonial-intext"><div class="testimonial-wrap"><blockquote><em>
|
||||
Better List View is <b>awesome</b>.
|
||||
</em></blockquote><strong>Daniel N</strong></div></div>
|
||||
|
||||
<h3>Hierarchical items</h3>
|
||||
|
||||
You can create tree-like structures in Better ListView; inbuilt drag & drop hierarchical reordering of items.
|
||||
|
||||
<h3>Improved grouping</h3>
|
||||
|
||||
Better grouping – customizable group headers look and behavior, collapsible, image support, context menu support, focusable, etc. Each group header can be customized individually.
|
||||
|
||||
<h3>Save/load contents with 1 line of code</h3>
|
||||
|
||||
You can save or load the contents of Better ListView in just 1 line of code, either to file or string. Both XML and binary serialization is supported.
|
||||
|
||||
<h3>Double-buffered and flicker free</h3>
|
||||
|
||||
Simply put, Better ListView is smooth. Regular listview requires multiple anti-flicker techniques, but you do not have to worry about that with Better ListView. Better ListView is optimized for 100k+ items.
|
||||
|
||||
<h3>Column header images</h3>
|
||||
|
||||
You can use images in column headers. Custom image sizes are supported.
|
||||
|
||||
<div class="image"><img alt="Column Header Images" src="http://assets.componentowl.com/images/8/Column Header Images_original_1298620501.png?1298595301" /></div>
|
||||
|
||||
<h3>Sub-item images</h3>
|
||||
|
||||
You can set images to list view sub-items. Regular list view allows you to set only one image per list view item, but Better ListView can show image for every sub-item (in every column).
|
||||
|
||||
<h3>Image-List and Image Support</h3>
|
||||
|
||||
Better ListView supports both image list, or individual image objects (System.Drawing.Image). Regular list view forces you to use ImageList object.
|
||||
|
||||
<h3>Custom list view Image size</h3>
|
||||
|
||||
You can use any image size in the list view. Better ListView can also automatically resize images with preserving aspect ratio.
|
||||
|
||||
<h3>Drag & drop with insertion mark</h3>
|
||||
|
||||
Highly customizable drag-drop for both internal and external drag-drop. You can use drop highlight or insertion mark drag drop modes.
|
||||
|
||||
<div class="image"><img alt="List View Item Reordering Mark Preview" src="http://assets.componentowl.com/images/21/List View Item Reordering Mark Preview_original_1298631798.png?1298606598" /></div>
|
||||
|
||||
<h3>List view item reordering</h3>
|
||||
|
||||
Better ListView has inbuilt item reordering and item drag & drop inserting at the position specified by user. Drag & drop preview is shown using an insertion mark.
|
||||
|
||||
<h3>Column-header reordering</h3>
|
||||
|
||||
Better ListView has inbuilt easy drag & drop column header reordering that is much easier to use than in the regular list view. Insertion mark is shown, auto-scrolling is supported.
|
||||
|
||||
<div class="image"><img alt="Column Header Reordering With Insertion Mark" src="http://assets.componentowl.com/images/9/Column Header Reordering With Insertion Mark_original_1298621331.png?1298596131" /></div>
|
||||
|
||||
<h3>Auto-scroll for column header reordering and item reordering</h3>
|
||||
|
||||
Better ListView has inbuilt auto-scrolling for column header and item reordering.
|
||||
|
||||
<h3>Column headers can be shown in all views</h3>
|
||||
|
||||
Better ListView can display column headers in all views - Details, SmallIcons, LargeIcons, List, Tile, Thumbnails. This allows users to sort items in all views. Additionally, you can also hide the column headers even in the details view.
|
||||
|
||||
<div class="image"><img alt="Column Headers in LargeIcons View" src="http://assets.componentowl.com/images/10/Column Headers In LargeIcons View_original_1298622038.png?1298596838" /></div>
|
||||
|
||||
<h3>Thumbnails view mode</h3>
|
||||
|
||||
Better ListView supports additional "thumbnails" view mode that allows you to view images of large sizes. The images are automatically and smoothly resized with preserved aspect ratio. You can define the maximum/minimum desired image sizes.
|
||||
|
||||
<h3>Image shadows, borders and padding</h3>
|
||||
All images in Better ListView can have border or shadow specified. You can also specify padding that gives you space for owner drawing (eg. overlay images). This can be used in all views.
|
||||
|
||||
Image shadows like in Windows 7 theme are supported. Windows Explorer uses very similar shadows for image thumbnails.
|
||||
|
||||
<div class="image"><img alt="ListView Image Shadows and Image Borders" src="http://assets.componentowl.com/images/11/ListView Image Shadows and Image Borders_original_1298622678.png?1298597478" /></div>
|
||||
|
||||
<h3>Multi-column sorting</h3>
|
||||
|
||||
You can sort by multiple columns in Better ListView. Simply shift+click a secondary (or third, etc) column to add it to the current sort. Zero code needed. Additionally, the background of the primary (first) sort column can be highlighted.
|
||||
|
||||
<div class="image"><img alt="Multi Column Sort in List View" src="http://assets.componentowl.com/images/12/Multi Column Sort in List View_original_1298623013.png?1298597813" /></div>
|
||||
|
||||
<h3>Inbuilt sorting and natural sorting</h3>
|
||||
|
||||
Better ListView has inbuilt list view sorting that works out of the box. You no longer need to implement your own item comparer. If custom comparer is needed, you can inherit from the Better ListView comparer to save time.
|
||||
|
||||
<h3>Richer event data</h3>
|
||||
|
||||
Many events have richer event data that allow you to do extra operations or tell you extra useful information. The richer events include: AfterItemSort, BeforeDrag, BeforeItemSort, ColumnClick (allows you to cancel sort), DragDropException, DrawBackground, DrawColumnHeaderBackground, DrawColumnHeader, DrawItemBackground, DrawItem, HitTestChanged, ItemActivate (event data tells you how the item got activated - mouse, keyboard or code), ItemDrag, ItemDrop, ItemReorder, ItemSearch, LabelEdit, RequestEmebeddedControl.
|
||||
|
||||
<h3>Checkboxes in all views</h3>
|
||||
|
||||
You can have checkboxes in LargeIcons view, SmallIcons view, List view, Thumbnails view and of course also in the Details view.
|
||||
|
||||
<div class="image"><img alt="Checkboxes In LargeIcons View" src="http://assets.componentowl.com/images/13/Checkboxes In LargeIcons View_original_1298623385.png?1298598185" /></div>
|
||||
|
||||
<h3>Three state checkboxes</h3>
|
||||
Three state checkboxes are supported in Better ListView:
|
||||
|
||||
<div class="image"><img alt="Three-State Checkboxes in List View" src="http://assets.componentowl.com/images/14/Three State Checkboxes in List View_original_1298624577.png?1298599377" /></div>
|
||||
|
||||
<h3>Hide or show checkboxes of specific ListView Items</h3>
|
||||
|
||||
You can hide checkbox for any ListViewItem. You can also show checkboxes only for specified items. All list items in Better ListView have "AllowShowCheckBox" property.
|
||||
|
||||
<div class="image"><img alt="Show or hide checkboxes for specific listview items" src="http://assets.componentowl.com/images/23/show-or-hide-checkboxes-for-specific-listview-items_original_1299748307.png?1299723107" title="Show or hide checkboxes for specific listview items" /></div>
|
||||
|
||||
<h3>Powerful list view tooltips</h3>
|
||||
|
||||
You can display tooltips for nearly any part of Better ListView - tooltips for items, sub-items, checkboxes, item images, sub-item images, column headers, column header images, column header borders, and even for custom areas (regions). Owner-drawn tooltips are supported.
|
||||
|
||||
<div class="image"><img alt="List View Regional Tooltips and Owner Drawn Tooltips" src="http://assets.componentowl.com/images/15/List View Tooltips Region And Owner Drawn Tooltips_original_1298632357.png?1298607157" /></div>
|
||||
|
||||
<h3>Uses current Windows theme</h3>
|
||||
|
||||
Instead of implementing custom, un-native look and feel, Better ListView always automatically fully uses the current system theme. It supports Aero as well. Better ListView always looks great and feels right to the user.
|
||||
|
||||
<h3>XML and binary serialization of everything</h3>
|
||||
|
||||
Every part of Better ListView (items, sub-items, column headers) can be both binary and XML serialized. You can easily XML serialize whole list view (or binary serialize) to save it to file or transfer items between controls. Standard ways of .NET serialization can be used (BinaryFormatter, XmlSerializer).
|
||||
|
||||
<h3>Owner drawing</h3>
|
||||
|
||||
Better ListView allows you to draw over the client area, items and column headers. Contrary to .NET ListView, owner drawing is fully operational even when the system uses Aero theme. You can draw separately to background and foreground parts of Better ListView without worrying about proper drawing order. Owner drawing events provide rich data, including exact item state and areas of every item part.
|
||||
|
||||
<div class="image"><img alt="List View Owner Drawing Background Gradient" src="http://assets.componentowl.com/images/22/List View Owner Drawing Background Gradient_original_1298633053.png?1298607853" /></div>
|
||||
|
||||
<h3>Multi-line items</h3>
|
||||
|
||||
Better ListView supports multi-line items. Items with very long text can be displayed on multiple lines. Highly customizable and powerful: Focused items can have custom number of lines; hard line breaks supported as well. Foreground overlay "watermark" images are easily achievable using owner-drawing.
|
||||
|
||||
<div class="image"><img src="http://assets.componentowl.com/screenshots/21/multi-line-items_original_1312133213.png?1312133213" alt="Multi-line items"></div>
|
||||
|
||||
<h3>Background image support</h3>
|
||||
|
||||
Display background image in Better ListView easily using the BackgroundImage property. Many layouts (stretch, tile, none), alignments (top, bottom, left, right, center and combinations) are supported, as well as customizable opacity.
|
||||
|
||||
<div class="image"><img alt="ListView Background Image" src="http://assets.componentowl.com/images/27/Background-Images_original_1326106027.png?1326080827" title="ListView Background Image" /></div>
|
||||
|
||||
<h3>Context menu for column headers, list items, and empty area</h3>
|
||||
|
||||
Better ListView supports 3 types of context menus: Column header context menu, list view items context menu, and empty area context menu (when right-clicking white space).
|
||||
|
||||
<div class="image"><img alt="Column Header Context Menu in List View" src="http://assets.componentowl.com/images/17/Column Header Context Menu in List View_original_1298721855.png?1298696655" /></div>
|
||||
|
||||
<h3>Advanced hit-test with detailed information</h3>
|
||||
The hit test in Better ListView returns very detailed information. It tells you not only the location (Client Area, Sub-Item, Sub-Item Text, Sub-Item Image, Checkbox, Column Header Image, and many more), but it also tells you the state of the item, and part of the item (left or right).
|
||||
|
||||
<div class="image"><img alt="Advanced Hit-Test With Detailed Information" src="http://assets.componentowl.com/images/26/Advanced-Hit-Test_original_1326105831.png?1326080631" title="Advanced Hit-Test With Detailed Information" /></div>
|
||||
|
||||
<h3>Customizable search-by-typing</h3>
|
||||
|
||||
Better ListView has excellent customization functionality for find-as-you-type item searching. The search modes include: Prefix (searchs from beginning of items), Substring (search any part of item text), Prefix + Substring, or Disabled. Additionally, search options include: Case sensitive, search first word only, play sound when item not found, prefer prefixes, search whole words. You can also restrict the search to only certain columns. You can also call "FindItemsWithText" function to find items from code.
|
||||
|
||||
<h3>Display text when the list view is empty</h3>
|
||||
You can display a gray text centered in the list view if it's empty to hint or educate users. This will make your software more user friendly.
|
||||
|
||||
<div class="image"><img alt="Show Text When List View is Empty" src="http://assets.componentowl.com/images/18/Show Text When List View is Empty_original_1298629916.png?1298604716" /></div>
|
||||
|
||||
<h3>Embed controls for item editing</h3>
|
||||
Inbuilt in-line editing support includes label edit, combobox edit, date picker edit. You can also embed any custom control for in-line editing. Sub-item editing is supported. Highly customizable.
|
||||
|
||||
<div class="image"><img alt="Custom Embedded Control in List View for Editing" src="http://assets.componentowl.com/images/19/Custom Embedded Control in List View for Editing_original_1298630263.png?1298605063" /></div>
|
||||
|
||||
<h3>ListView item text formatting</h3>
|
||||
|
||||
Supports both text trimming and auto-ellipsis for text that's too long. You can choose from: TrimCharacter, TrimWord, EllipsisCharacter, EllipsisWord, EllipsisPath (for file paths). Column header text can be broken into multiple lines.
|
||||
|
||||
<h3>Focusable ListView sub-items and groups</h3>
|
||||
|
||||
Focus sub-items or groups in Better ListView easily with keyboard. Just use the arrow keys. (This is impossible with the regular .NET ListView)
|
||||
<div class="image"><img alt="Focusable sub-items in Better ListView" src="http://assets.componentowl.com/images/25/focus-list-view-sub-items_original_1313674098.png?1313648898" title="Focusable sub-items in Better ListView" /></div>
|
||||
|
||||
<h3>Automatic list view layout</h3>
|
||||
|
||||
Better ListView can auto-size item images, item text, column header images, column header text.
|
||||
|
||||
<h3>Custom list view item size</h3>
|
||||
|
||||
You can set custom sizes for item text area and item images. You can also set custom size for column header text area and column header images. (Text area size is different from font size, text area size basically defines the size of the list view item.) This enables you to make tiny/huge column headers or list view items.
|
||||
|
||||
<div class="image"><img alt="Custom Item Size in List View" src="http://assets.componentowl.com/images/20/Custom Item Size in List View_original_1298630739.png?1298605539" /></div>
|
||||
|
||||
<div class="testimonial-intext"><div class="testimonial-wrap"><blockquote><em>
|
||||
It's an odd thing when you're inspired by a form component, but Component Owl
|
||||
with their Better ListView has done it. Love its native feel.
|
||||
</em></blockquote><strong>Daniel N, USA</strong></div></div>
|
||||
|
||||
<h2>More advantages of our improved list view component:</h2>
|
||||
<ul class="common">
|
||||
<li><strong>Developer friendly</strong>: All classes and properties are as similar to the regular list view as possible. Everything is intuitive, very little learning is needed. You can use Better ListView immediately. <strong>Save time and ship sooner</strong>.</li>
|
||||
<li><strong>Better ListView has improved usability and fixed behavior</strong>. All Windows users are familiar with the list view used in Windows Explorer. Better ListView mimicks behavior and look & feel of the Windows Explorer list view as much as possible to leverage the existing user knowledge. <strong>Using Better ListView is pleasant for users.</strong> Many other list view components implement custom look and behavior and can oftentimes downright frustrate users (many controls don't even support mouse-wheel scrolling!) This doesn't happen with Better ListView.</li>
|
||||
<li><strong>Guaranteed support and continued development</strong>: Better ListView is developed as a joint-venture of two software companies that use Better ListView in their main products (popular <strong><a href="http://www.dextronet.com/swift-to-do-list-software" target="_blank">Swift To-Do List</a></strong> and <strong><a href="http://www.imagingshop.com" target="_blank">ImagingShop</a></strong>). These applications are used by thousands of users daily. This is your guarantee that Better ListView will be supported and developed in the future.</li>
|
||||
<li><strong>Tested in real world applications by thousands of users</strong>: Because Better ListView is used in professional consumer desktop software applications - Swift To-Do List and ImagingShop, thousands of users work with Better ListView every day. Although we use unit tests that cover most of code, and do thorough inhouse testing, this is your true guarantee that it is tested thoroughly in the real world. It is <strong>extremely stable</strong>.</li>
|
||||
<li>Better ListView does <strong>not</strong> inherit from the regular .NET list view. It is written in pure managed C# code and is flexible, light weight, and fast. Extensions of the regular .net list view only go so far. Better ListView goes further. Soure code licenses are also available for ultimate customization.</li>
|
||||
</ul>
|
||||
|
||||
<div class="testimonial-intext"><div class="testimonial-wrap"><blockquote><em>
|
||||
In addition to creating a new List View control to incorporate <b>broader flexibility and functionality</b>, Better ListView could also be called <b>Fixed ListView</b>, as it corrects a number of annoying problems with the standard List View that Microsoft delivers to Visual Studio customers.
|
||||
</em></blockquote><strong>DevProConnections.com Review</strong></div></div>
|
||||
|
||||
</div></div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div class="left">
|
||||
|
||||
<div class="buttons-box">
|
||||
<a onclick="ga('send', 'event', 'trial', 'click');" data-sumome-listbuilder-id="4016d967-e098-487d-a20e-da328d2345df" class="standard-download image-link">Download Free Trial - With sample projects</a>
|
||||
<a href="../../../pricing-licensing/better-listview.html" class="standard-buy image-link">See Pricing & Licensing</a>
|
||||
<p>Version 3.15 / May 27, 2015</p>
|
||||
</div>
|
||||
<div class="compatibility">
|
||||
<p><strong>Seamless integration with .NET 2.0 and higher</strong></p>
|
||||
<div class="documentation">
|
||||
<p><a href="../../../better-listview/quick-start-guide.html" onclick="window.open(this.href); return false">See Quick Start Guide</a></p>
|
||||
<p><a href="../../../better-listview/documentation.html" onclick="window.open(this.href); return false">See Documentation</a></p>
|
||||
|
||||
<p><a href="../../../better-listview/class-reference.html" onclick="window.open(this.href); return false">See Class Reference</a></p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="screenshot">
|
||||
<p><a href="http://assets.componentowl.com/screenshots/15/blv-overview_original_1326499754.png?1326474554" class="screenshot" title="Better ListView control"><img alt="Better ListView" src="http://assets.componentowl.com/screenshots/15/blv-overview_thumb_1326499754.png?1326474554" /></a></p>
|
||||
</div>
|
||||
<div class="newsletter">
|
||||
<form action="http://www.componentowl.com/subscriptions" class="new_subscription" id="new_subscription_product" method="post" onsubmit="if (!validate_newsletter_form(this)) return false; jQuery.ajax({data:jQuery.param(jQuery(this).serializeArray()) + '&authenticity_token=' + encodeURIComponent('dJeFtbWrARc0arEomU+SG+XtypwJr2F4Kc9v14woStM='), dataType:'script', type:'post', url:'/subscriptions'}); return false;"><div style="margin:0;padding:0;display:inline"><input name="authenticity_token" type="hidden" value="dJeFtbWrARc0arEomU+SG+XtypwJr2F4Kc9v14woStM=" /></div> <input id="subscription_subscription_location_id" name="subscription[subscription_location_id]" type="hidden" value="512994065" />
|
||||
<input id="form_id" name="form_id" type="hidden" value="#new_subscription_product" />
|
||||
<strong>Receive product updates<br />and news via email:</strong>
|
||||
<div><input class="email inline-label" id="product-newsletter-email" name="subscription[email]" size="30" type="text" value="Your Email" /></div>
|
||||
<div id="product-newsleter-lists" class="subscription-lists-ct" style="display: none"><input name="subscription[subscription_list_ids][]" type="hidden" value="970100327" />
|
||||
<input name="subscription[subscription_list_ids][]" type="hidden" value="1009842129" /></div>
|
||||
<span class="dbtn-c subscribe dbtn-small" id="send"><span class="dbtn-w"><input class="dbtn" name="commit" type="submit" value="Subscribe" /></span></span>
|
||||
</form></div>
|
||||
|
||||
<div class="screenshot">
|
||||
<p><a href="http://assets.componentowl.com/screenshots/16/thumbnails_original_1312133021.png?1312107821" class="screenshot" title="Image thumbnails in groups"><img alt="Thumbnails" src="http://assets.componentowl.com/screenshots/16/thumbnails_thumb_1312133021.png?1312107821" /></a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="screenshot">
|
||||
<p><a href="http://assets.componentowl.com/screenshots/21/multi-line-items_original_1312133213.png?1312108013" class="screenshot" title="Items with multi-line text"><img alt="Multi-line Items" src="http://assets.componentowl.com/screenshots/21/multi-line-items_thumb_1312133213.png?1312108013" /></a></p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="screenshot">
|
||||
<p><a href="http://assets.componentowl.com/screenshots/18/betterlistview-tree-hierarchy_original_1313676477.png?1313651277" class="screenshot" title="Items organized in a tree-like hierarchy"><img alt="Item Hierarchy" src="http://assets.componentowl.com/screenshots/18/betterlistview-tree-hierarchy_thumb_1313676477.png?1313651277" /></a></p>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="small-button-ct">
|
||||
<a href="../../../better-listview/screenshots.html" class="small-button"><span>More Screenshots</span></a>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="buttons-wrap">
|
||||
<div class="buttons">
|
||||
<a onclick="ga('send', 'event', 'trial', 'click');" data-sumome-listbuilder-id="4016d967-e098-487d-a20e-da328d2345df" class="standard-download image-link">Download Free Trial - With sample projects</a>
|
||||
|
||||
<a href="../../../pricing-licensing/better-listview.html" class="standard-buy image-link">See Pricing & Licensing</a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div id="screenshot-buttons" style="display: none">
|
||||
<div class="buttons">
|
||||
<a href="../../../betterlistview.exe" class="small-download image-link" onclick="download_email('better-listview');">Free Download</a>
|
||||
<a href="../../../pricing-licensing/better-listview.html" class="small-buy image-link">See Pricing & Licensing</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="d-footer">
|
||||
<div class="d-placing">
|
||||
|
||||
<div class="left">
|
||||
<div class="latest-posts">
|
||||
<h3 class="latest_from_blog"><a href="../../../blog.html">Latest From Our Blog</a></h3>
|
||||
|
||||
<h4><a href="../../../blog/index.html%3Fp=927.html">Activation issues and how to solve them</a></h4>
|
||||
<div class="post-info">Wednesday, 01 March 2017</div>
|
||||
|
||||
<h4><a href="../../../blog/index.html%3Fp=921.html">The Three Main Advantages Better ListView has Over the Classic .NET Framework</a></h4>
|
||||
<div class="post-info">Thursday, 09 February 2017</div>
|
||||
|
||||
<h4><a href="../../../blog/index.html%3Fp=914.html">BLV and Internet Explorer</a></h4>
|
||||
<div class="post-info">Sunday, 13 November 2016</div>
|
||||
|
||||
<h4><a href="../../../blog/index.html%3Fp=906.html">Centering Images in Better ListView Sub-items</a></h4>
|
||||
<div class="post-info">Wednesday, 06 August 2014</div>
|
||||
|
||||
<h4><a href="../../../blog/index.html%3Fp=901.html">Sub-item Check Boxes in Better ListView</a></h4>
|
||||
<div class="post-info">Sunday, 06 July 2014</div>
|
||||
|
||||
</div>
|
||||
<div class="other-posts"><a href="../../../blog.html">See more posts »</a></div>
|
||||
</div>
|
||||
|
||||
<div class="right">
|
||||
<div class="news">
|
||||
<ul class="links">
|
||||
<li><a href="../../../feeds.rss" class="rss">Subscribe to our RSS</a></li>
|
||||
<li><a href="http://twitter.com/ComponentOwl" class="twitter">Follow us on twitter</a></li>
|
||||
</ul>
|
||||
|
||||
<div class="news-item ">
|
||||
<div class="date">27<span>May</span></div>
|
||||
<div class="message">
|
||||
|
||||
<h4>Better ListView Express 3.15 released!</h4>
|
||||
<p>
|
||||
|
||||
<a href="../../../betterlistviewexpress.exe" onclick="download_email('better-listview-express');">Download latest release</a>
|
||||
</p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="news-item ">
|
||||
<div class="date">27<span>May</span></div>
|
||||
<div class="message">
|
||||
|
||||
<h4>Better ListView 3.15 released!</h4>
|
||||
<p>
|
||||
|
||||
<a href="../../../betterlistview.exe" onclick="download_email('better-listview');">Download latest release</a>
|
||||
</p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="news-item ">
|
||||
<div class="date">27<span>May</span></div>
|
||||
<div class="message">
|
||||
|
||||
<h4>Better SplitButton 3.15 released!</h4>
|
||||
<p>
|
||||
|
||||
<a href="../../../bettersplitbutton.exe" onclick="download_email('better-splitbutton');">Download latest release</a>
|
||||
</p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="news-item ">
|
||||
<div class="date">27<span>May</span></div>
|
||||
<div class="message">
|
||||
|
||||
<h4>Better Thumbnail Browser 3.15 released!</h4>
|
||||
<p>
|
||||
|
||||
<a href="../../../betterthumbnailbrowser.exe" onclick="download_email('better-thumbnail-browser');">Download latest release</a>
|
||||
</p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="news-item last-item">
|
||||
<div class="date">08<span>Apr</span></div>
|
||||
<div class="message">
|
||||
|
||||
<h4>Better ListView Express 3.14.0 released!</h4>
|
||||
<p>
|
||||
|
||||
<a href="../../../better-listview-express/releases%3Fsince=3.14.0.html">See what's new</a>
|
||||
or
|
||||
|
||||
<a href="../../../betterlistviewexpress.exe" onclick="download_email('better-listview-express');">Download latest release</a>
|
||||
</p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="d-placing">
|
||||
<hr />
|
||||
<div class="copy"><div class="social"><a href="../../../support.html" class="feedback">Contact Us (Feedback)</a> <span>|</span> <a href="../../../feeds.rss" class="rss">RSS</a> <span>|</span> <a href="https://twitter.com/ComponentOwl" class="twitter">Twitter</a> <span>|</span> <a href="../../../sitemap.html" class="sitemap">Sitemap</a> <span>|</span> Our <a href="../../../index.html" class="stdl">task management software</a> that uses Better ListView</div>
|
||||
Copyright © 2021 ComponentOwl.com, All rights reserved. Read our <a href="../../../eula.html">EULA</a>, <a href="../../../disclaimer.html">Disclaimer</a> and <a href="../../../privacy-policy.html">Privacy Policy</a>.<br /></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<script src="../../../javascripts/app_packaged.js%3F1455269826" type="text/javascript"></script>
|
||||
<script async>(function(s,u,m,o,j,v){j=u.createElement(m);v=u.getElementsByTagName(m)[0];j.async=1;j.src=o;j.dataset.sumoSiteId='854b5e00f297990012cc230023375a00787c0000216621002775a800d79ad500';v.parentNode.insertBefore(j,v)})(window,document,'script','//load.sumo.com/');</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,160 @@
|
||||
<!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>Serialization</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-search.html"><strong>
|
||||
« Searching Items</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-sort.html"><strong>Sorting Items »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Serialization</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<p>All Better ListView elements, element collections and some support
|
||||
structures can be both <strong><em>binary</em></strong> and <strong><em>XML
|
||||
serialized</em></strong>. These classes implement <span class="code">ISerializable</span>
|
||||
and <span class="code">IXmlSerializable</span> interfaces. They are also marked by
|
||||
<span class="code">SerializableAttribute</span>.</p>
|
||||
|
||||
<p>Serializable element classes are:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewColumnHeader</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewGroup</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewItem</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>Serializable element collections are:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewColumnHeaderCollection</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewGroupCollection</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewItemCollection</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewSubItemCollection</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>Serializable support structures are:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewAddress</span> (<span class="code">ToString</span> and
|
||||
<span class="code">Parse</span> methods can be also used instead of
|
||||
serialization)</p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewInsertionLocation</span> (see <strong><em><a href="chapter-insertion-mark.html">Insertion Mark</a></em></strong>)</p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewItemDragData</span> (see <strong><em><a href="chapter-drag-drop.html">Drag and Drop</a></em></strong>)</p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewSortList</span> (see <strong><em><a href="chapter-sort.html">Sorting Items</a></em></strong>)</p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewToolTipInfo</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewToolTipInfoCollection</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<h2>Comparing Elements and Collection by Value</h2>
|
||||
|
||||
|
||||
<p>When you need to check whether two objects from Better ListView
|
||||
(namely elements or collections) are same, you can serialize them and
|
||||
compare the serialized data. More efficient way to do the same is to call
|
||||
<span class="code">EqualsContent</span> method.</p>
|
||||
|
||||
<p>When using <span class="code">EqualsContent</span> on element instances, this
|
||||
method checks whether the two elements have same text, font, color...
|
||||
rather than whether there are the same instance (as happens with
|
||||
<span class="code">Equals</span> ro <span class="code">ReferenceEquals</span>):</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">// create some item
|
||||
BetterListViewItem item1 = new BetterListViewItem("new iem");
|
||||
|
||||
// create second item as a clone of the first
|
||||
BetterListViewItem item2 = (BetterListViewItem)item1.Clone();
|
||||
|
||||
// check whether item1 and item2 are different instances
|
||||
item1.Equals(item2); // returns false
|
||||
|
||||
// check whether item1 and item2 have properties with the same values
|
||||
item1.EqualsContent(item2); // returns true</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">' create some item
|
||||
Dim item1 As New BetterListViewItem("new iem")
|
||||
|
||||
' create second item as a clone of the first
|
||||
Dim item2 As BetterListViewItem = DirectCast(item1.Clone(), BetterListViewItem)
|
||||
|
||||
' check whether item1 and item2 are different instances
|
||||
item1.Equals(item2) ' returns false
|
||||
|
||||
' check whether item1 and item2 have properties with the same values
|
||||
item1.EqualsContent(item2) ' returns true</code></pre>
|
||||
|
||||
<br><hr>
|
||||
<p class="note">When using <span class="code">EqualsContent</span> on collection instances,
|
||||
this method check whether both collections contain the same instances of
|
||||
collection items. It does not compare collection items by content. To do
|
||||
this, you still need to iterate both collections and call
|
||||
<span class="code">EqualsContent</span> on each collection element.</p>
|
||||
<hr>
|
||||
<br><br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-search.html"><strong>
|
||||
« Searching Items</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-sort.html"><strong>Sorting Items »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,446 @@
|
||||
<!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>Sorting Items</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-serialization.html"><strong>
|
||||
« Serialization</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-sub-items.html"><strong>Sub-items »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Sorting Items</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<p>Better ListView has extensive support for sorting, while it is usually
|
||||
very easy (few lines of code) to customize sorting by one's needs.</p>
|
||||
|
||||
<p>The only action needed to enable sorting is to set
|
||||
<span class="code">BetterListViewColumnHeader.Style</span> to <span class="code">Sortable</span> on
|
||||
every column you wish to enable user sorting.</p>
|
||||
|
||||
<h2>Multi-Column Sorting</h2>
|
||||
|
||||
|
||||
<br><hr>
|
||||
<p class="note">Multi-column sorting is not supported in <strong><em>Better ListView
|
||||
Express</em></strong>.</p>
|
||||
<hr>
|
||||
<br><p>When the <span class="code">AllowMultiColumnSorting</span> property is set to
|
||||
<span class="code">true</span> and there are multiple columns with <span class="code">Style</span>
|
||||
property set to <span class="code">Sortable</span>, user can sort items by multiple
|
||||
columns by holding <strong><em>Shift</em></strong> key while clicking on the
|
||||
sortable columns.</p>
|
||||
|
||||
<p>Here is a list of movies sorted by two columns:</p>
|
||||
|
||||
<p class="images"><img src="sorting-multi-column.png"></p>
|
||||
|
||||
<p>In this case, user first clicked on the
|
||||
<strong><em>Director</em></strong> column, and then twice on the
|
||||
<strong><em>Title</em></strong> column while holding <strong><em>Shift</em></strong>
|
||||
key. Now the list is sorted by the director's name in ascending order, but
|
||||
when director names are the same, their movie titles are sorted in
|
||||
descending order.</p>
|
||||
|
||||
|
||||
<h2>Sorting by Key or Value</h2>
|
||||
|
||||
|
||||
<p>Sometimes, there are items with non-textual data that cannot be
|
||||
sorted simply by string comparison. For example, there can be progress
|
||||
bars or other graphic gauges on items. To sort such items (sub-items),
|
||||
Better ListView can gather data from two other properties:</p>
|
||||
|
||||
<ul style="list-style:none">
|
||||
<li>
|
||||
<span class="code">BetterListViewItem.Key</span>
|
||||
(<span class="code">BetterListViewSubItem.Key</span>)<ul style="list-style:none"><li>
|
||||
<p>.<span class="code">IComparable</span> object explicitly specified by the
|
||||
user for item comparison purposes.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">BetterListViewItem.Value</span>
|
||||
(<span class="code">BetterListViewSubItem.Value</span>)<ul style="list-style:none"><li>
|
||||
<p>Value of a property from bound data source specified by the
|
||||
ValueMember property of the corresponding column (see <strong><em><a href="chapter-data.html">Data Binding</a></em></strong> for more
|
||||
information).</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
</ul>
|
||||
<p>There are three sorting methods that are possible on each column
|
||||
separately (see
|
||||
<span class="code">BetterListViewColumnHeader.SortMethod</span>):</p>
|
||||
|
||||
<ul style="list-style:none">
|
||||
<li>
|
||||
<span class="code">Auto</span><ul style="list-style:none"><li>
|
||||
<p><span class="code">Key</span> is used primarily for comparison; if not
|
||||
available the comparer falls back to <span class="code">Value</span>, and if even
|
||||
this is not available, <span class="code">Text</span> is used.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">Text</span><ul style="list-style:none"><li>
|
||||
<p><span class="code">Text</span> is always used for comparison.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">Key</span><ul style="list-style:none"><li>
|
||||
<p><span class="code">Key</span> is used always for comparison.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
</ul>
|
||||
<h2>Custom and Natural (Alphanumeric) Item Comparers</h2>
|
||||
|
||||
|
||||
<p>Better ListView uses <span class="code">BetterListView.ItemComparer</span> for
|
||||
item comparison. You can set this property using custom comparer of type
|
||||
<span class="code">BetterListViewItemComparer</span>.</p>
|
||||
|
||||
<p>There are two comparers already implemented in Better ListView.
|
||||
These can be used publicly and extended:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewDefaultItemComparer</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewNaturalItemComparer</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>The difference between the two is explained in <strong><em><a href="chapter-sort.html#alphanumeric-sorting">Alphanumeric Sorting</a></em></strong> section
|
||||
below.</p>
|
||||
|
||||
|
||||
<h2>Making a Custom Item Comparer</h2>
|
||||
|
||||
|
||||
<p>To make a new item comparer with custom comparison rules, create a
|
||||
new class inheriting from <span class="code">BetterListViewItemComparer</span>.</p>
|
||||
|
||||
<p><span class="code">BetterListViewItemComparer</span> implements several methods
|
||||
doing item comparison on various levels. These methods can be overriden to
|
||||
customize sorting behavior:</p>
|
||||
|
||||
<ul style="list-style:none">
|
||||
<li>
|
||||
<span class="code">Compare</span><ul style="list-style:none"><li>
|
||||
<p>Compares two items. This is the core method for item
|
||||
comparison. <span class="code">BetterListViewItemComparer</span> implements
|
||||
multi-column sorting here and calls <span class="code">CompareSubItems</span> and
|
||||
<span class="code">CompareEqualItems</span> from here.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">CompareSubItems</span><ul style="list-style:none"><li>
|
||||
<p>Compares two sub-items in the same column. Here the
|
||||
<span class="code">BetterListViewItemComparer</span> implements sorting methods
|
||||
(specified by <span class="code">BetterListViewColumnHeader.SortMethod</span>
|
||||
property) and calls <span class="code">CompareValues</span> from here. The
|
||||
sub-items are compared here either by value, key or by text.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">CompareValues</span><ul style="list-style:none"><li>
|
||||
<p>Compares two arbitrary <span class="code">IComparable</span> values in the
|
||||
specified order. <span class="code">BetterListViewItemComparer</span> implements
|
||||
comparison with possible <span class="code">null</span> values and regarding the
|
||||
sort order.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">CompareEqualItems</span><ul style="list-style:none"><li>
|
||||
<p>When two items are considered equal in the
|
||||
<span class="code">Compare</span> method, <span class="code">BetterListViewItemComparer</span>
|
||||
calls this method, which compares the items by their index.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
</ul>
|
||||
<p>It is not necessary to override all the above methods, since they
|
||||
are already implemented in the <span class="code">BetterListViewItemComparer</span>
|
||||
base class.</p>
|
||||
|
||||
<p>For example, if we want to create a custom comparer that compares
|
||||
items accroding to their check box state:</p>
|
||||
|
||||
<p class="images"><img src="sorting-custom.png"></p>
|
||||
|
||||
<p>we only have to override the <span class="code">Compare</span> method. If the
|
||||
check box state is the leading criterion for sorting, we implement the
|
||||
comparison and then call <span class="code">Compare</span> method of the base class (to
|
||||
allow for multi-column sorting, further sorting according to item text
|
||||
etc.). Our custom "checkbox" comparer would look like this:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">class CheckBoxItemComparer : BetterListViewItemComparer
|
||||
{
|
||||
public override int Compare(BetterListViewItem itemA, BetterListViewItem itemB)
|
||||
{
|
||||
if (itemA != null &&
|
||||
itemB != null)
|
||||
{
|
||||
int valueA = (itemA.Checked
|
||||
? 1
|
||||
: 0);
|
||||
|
||||
int valueB = (itemB.Checked
|
||||
? 1
|
||||
: 0);
|
||||
|
||||
int result = valueA.CompareTo(valueB);
|
||||
|
||||
if (result != 0)
|
||||
{
|
||||
return result;
|
||||
}
|
||||
}
|
||||
|
||||
return base.Compare(itemA, itemB);
|
||||
}
|
||||
}</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">Class CheckBoxItemComparer Inherits BetterListViewItemComparer
|
||||
|
||||
Public Overrides Function Compare(itemA As BetterListViewItem, itemB As BetterListViewItem) As Integer
|
||||
|
||||
If itemA IsNot Nothing AndAlso itemB IsNot Nothing Then
|
||||
|
||||
Dim valueA As Integer = (If(itemA.Checked, 1, 0))
|
||||
|
||||
Dim valueB As Integer = (If(itemB.Checked, 1, 0))
|
||||
|
||||
Dim result As Integer = valueA.CompareTo(valueB)
|
||||
|
||||
If result <> 0 Then
|
||||
Return result
|
||||
End If
|
||||
|
||||
End If
|
||||
|
||||
Return MyBase.Compare(itemA, itemB)
|
||||
|
||||
End Function
|
||||
|
||||
End Class</code></pre>
|
||||
|
||||
<p>On the contrary, if you want to make check box the least important
|
||||
criteria in the sorting, put the comparison in the
|
||||
<span class="code">CompareEqualItems</span> method.</p>
|
||||
|
||||
<p>Finally, if the comparison result of the custom comparer depends on
|
||||
other sub-items, consider implementing the <span class="code">CompareSubItems</span>
|
||||
method.</p>
|
||||
|
||||
|
||||
<h2>Highlighting the Sorted Column</h2>
|
||||
|
||||
|
||||
<p class="images"><img src="sorting-highlight.png"></p>
|
||||
|
||||
<p>There are two properties influencing column highlighting:</p>
|
||||
|
||||
<ul style="list-style:none">
|
||||
<li>
|
||||
<span class="code">SortedColumnsRowsHighlight</span><ul style="list-style:none"><li>
|
||||
<p>Affects sorted column highlighting.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">ColorSortedColumn</span><ul style="list-style:none"><li>
|
||||
<p>Affects color of the highlighted column.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
</ul>
|
||||
<p>The column highlighting is practical in multi-column sorting,
|
||||
because it shows which column is the major one (the first sorted). By
|
||||
default, the first sorted column is highlighted in multi-column
|
||||
sorting.</p>
|
||||
|
||||
|
||||
<h2>
|
||||
<a name="alphanumeric-sorting" id="alphanumeric-sorting"></a>Alphanumeric
|
||||
Sorting</h2>
|
||||
|
||||
|
||||
<p class="images"><img src="sorting-alphanum1.png"><img src="sorting-alphanum2.png"></p>
|
||||
|
||||
<p>The most popular way of sorting (left image) is comparing text
|
||||
values of items by their ordinal value because such comparison is
|
||||
straightforward to implement.</p>
|
||||
|
||||
<p>Better ListView supports also alphanumeric (or natural) ordering of
|
||||
items, where numbers and words are compared separately. This gives us more
|
||||
convenient results (right image - see how numbers are ordered by their
|
||||
true value).</p>
|
||||
|
||||
<p>To use alphanumeric sorting, simply write:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">listView.ItemComparer = new BetterListViewNaturalItemComparer();</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">ListView.ItemComparer = New BetterListViewNaturalItemComparer()</code></pre>
|
||||
|
||||
|
||||
<h2>Working with Sort State</h2>
|
||||
|
||||
|
||||
<p>To store current sort state, Better ListView uses list-based data
|
||||
structure called <span class="code">SortList</span> (accessible with the property of
|
||||
the same name). <span class="code">SortList</span> contains indices and sort orders of
|
||||
the respective columns.</p>
|
||||
|
||||
<p>When a single solumn is sorted, <span class="code">SortList</span> contains one
|
||||
<span class="code">BetterListViewSortInfo</span> instance with index and sort order of
|
||||
that column.</p>
|
||||
|
||||
<p><span class="code">SortList</span> can be cloned (it is actually cloned every
|
||||
time you get a <span class="code">SortList</span> instance through the
|
||||
<span class="code">SortList</span> property getter). It is possible to copy sort state
|
||||
of one ListView to another:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">listView2.SortList = listView1.SortList;</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">listView2.SortList = listView1.SortList</code></pre>
|
||||
|
||||
|
||||
<h2>Suspending the Automatic Sorting</h2>
|
||||
|
||||
|
||||
<p>When items are sorted, any change in items (e.g. item added, label
|
||||
edited...) causes updating the items to keep them sorted. It is convenient
|
||||
in some situations to suspend this mechanism. For example, when one does
|
||||
several changes in items and want to re-sort them in the end.</p>
|
||||
|
||||
<p>Better ListView provides <span class="code">SuspendSort</span> and
|
||||
<span class="code">ResumeSort</span> to achieve just this. These methods work in the
|
||||
same fashion as <span class="code">BeginUpdate</span> / <span class="code">EndUpdate</span>. It is
|
||||
possible to nest these methods using multiple calls, so
|
||||
<span class="code">ResumeSort</span> have to be called same number of times as
|
||||
<span class="code">SuspendSort</span> to actually resume the automatic sorting.</p>
|
||||
|
||||
<p>The <span class="code">ResumeSort</span> have a boolean parameter specifying
|
||||
whether this call should also update item order (perform re-sorting). If
|
||||
you pass <span class="code">true</span> to this method, item update (re-sorting) will
|
||||
not be executed and is done after some change is made to items.</p>
|
||||
|
||||
|
||||
<h2>Unsorting</h2>
|
||||
|
||||
|
||||
<p>Sorting affects the order of items in the list and also introduces
|
||||
visual cues of the sort state. These can be removed by simply calling
|
||||
<span class="code">Unsort</span> method.</p>
|
||||
|
||||
<p>Alternatively, setting <span class="code">BetterListView.SortList</span> to
|
||||
either empty <span class="code">SortList</span> or null does the same job.</p>
|
||||
|
||||
|
||||
<h2>Sample Source Code</h2>
|
||||
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">this.listView.BeginUpdate();
|
||||
|
||||
this.listView.Columns.Add("Text");
|
||||
|
||||
this.listView.Columns[0].Style = BetterListViewColumnHeaderStyle.Sortable;
|
||||
|
||||
this.listView.Items.AddRange(
|
||||
new[]
|
||||
{
|
||||
"Beta 009",
|
||||
"Alpha 113",
|
||||
"Charlie2",
|
||||
"Alpha 96",
|
||||
"Beta 030",
|
||||
"Charlie1"
|
||||
});
|
||||
|
||||
// suspend sorting so that items will not be sorted by setting ItemComparer (we let user to sort them by himself by clicking the column)
|
||||
this.listView.SuspendSort();
|
||||
|
||||
// set natural item comparer provided by Better ListView
|
||||
// to reset comparer, simply set it to 'null' or new instance of 'BetterListViewItemComparer'
|
||||
this.listView.ItemComparer = new BetterListViewNaturalItemComparer();
|
||||
|
||||
// resume sorting so that user will be able to sort items by himself
|
||||
this.listView.ResumeSort(true);
|
||||
|
||||
this.listView.EndUpdate();</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">ListView.BeginUpdate()
|
||||
|
||||
ListView.Columns.Add ("Text")
|
||||
|
||||
ListView.Columns (0).Style = BetterListViewColumnHeaderStyle.Sortable
|
||||
|
||||
ListView.Items.AddRange(
|
||||
New String() {
|
||||
"Beta 009",
|
||||
"Alpha 113",
|
||||
"Charlie2",
|
||||
"Alpha 96",
|
||||
"Beta 030",
|
||||
"Charlie1"
|
||||
})
|
||||
|
||||
' suspend sorting so that items will not be sorted by setting ItemComparer (we let user to sort them by himself by clicking the column)
|
||||
ListView.SuspendSort()
|
||||
|
||||
' set natural item comparer provided by Better ListView
|
||||
' to reset comparer, simply set it to 'null' or new instance of 'BetterListViewItemComparer'
|
||||
ListView.ItemComparer = New BetterListViewNaturalItemComparer()
|
||||
|
||||
' resume sorting so that user will be able to sort items by himself
|
||||
ListView.ResumeSort (True)
|
||||
|
||||
ListView.EndUpdate()</code></pre>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-serialization.html"><strong>
|
||||
« Serialization</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-sub-items.html"><strong>Sub-items »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,99 @@
|
||||
<!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>Sub-items</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-sort.html"><strong>
|
||||
« Sorting Items</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-text-formatting.html"><strong>Text Formatting »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Sub-items</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<p>Every item within the list view can contain sub-items. These can be
|
||||
accessed using <span class="code">BetterListViewItem.SubItems</span> collection.</p>
|
||||
|
||||
<p>Sub-items are displayed only in the <strong><em>Details</em></strong> view
|
||||
when the columns are present. Each item can have any number of sub-items,
|
||||
but the number of sub-items displayed is limited by the number of column
|
||||
headers.</p>
|
||||
|
||||
<p>The following screenshot shows Better ListView with items and
|
||||
sub-items displayed on the right of each items (in columns) with one
|
||||
sub-item being focused (see <strong><em><a href="chapter-focus.html">Focusing
|
||||
Elements</a></em></strong> for more information):</p>
|
||||
|
||||
<p class="images"><img src="sub-items.png"></p>
|
||||
|
||||
<h2>Copying sub-items</h2>
|
||||
|
||||
|
||||
<p>The sub-item collection behaves differently than other collections
|
||||
present in Better ListView.</p>
|
||||
|
||||
<p>It always have to contain at least one sub-item. Even if you call
|
||||
<span class="code">Clear</span> method, one sub-item remains in the collection. This is
|
||||
because this sub-item represents properties of the item itself.</p>
|
||||
|
||||
<p>To copy sub-items from one item to another, you have to consider
|
||||
<strong><em>setting</em></strong> the first sub-item, while adding the
|
||||
other:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">itemTarget.SubItems[0] = (BetterListViewSubItem)itemSource.SubItems[0].Clone();
|
||||
|
||||
for (int indexSubItem = 1; indexSubItem < itemSource.SubItems.Count; indexSubItem++)
|
||||
{
|
||||
itemTarget.SubItems.Add((BetterListViewSubItem)itemSource.SubItems[indexSubItem].Clone());
|
||||
}</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">itemTarget.SubItems(0) = DirectCast(itemSource.SubItems(0).Clone(), BetterListViewSubItem)
|
||||
|
||||
For indexSubItem As Integer = 1 To itemSource.SubItems.Count - 1
|
||||
itemTarget.SubItems.Add(DirectCast(itemSource.SubItems(indexSubItem).Clone(), BetterListViewSubItem))
|
||||
Next</code></pre>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-sort.html"><strong>
|
||||
« Sorting Items</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-text-formatting.html"><strong>Text Formatting »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,444 @@
|
||||
<!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>Text Formatting</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-sub-items.html"><strong>
|
||||
« Sub-items</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-tooltips.html"><strong>Tooltips »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Text Formatting</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<p>Text formatting consists of text alignment, trimming, font and color.
|
||||
It can be adjusted on column headers, groups, items and sub-items.</p>
|
||||
|
||||
<h2>Text Alignment</h2>
|
||||
|
||||
|
||||
<p>Text in column header, item, sub-item and group elements can be
|
||||
aligned horizontally and vertically. The following images shows different
|
||||
horizontal alignment of sub-items...</p>
|
||||
|
||||
<p class="images"><img src="text-formatting-align1.png"></p>
|
||||
|
||||
<p>...and groups:</p>
|
||||
|
||||
<p class="images"><img src="text-formatting-align2.png"></p>
|
||||
|
||||
<p>Following properties govern horizontal text alignment on different
|
||||
element types:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewColumnHeader.AlignHorizontal</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewGroup.HeaderAlignmentHorizontal</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewItem.AlignHorizontal</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewSubItem.AlignHorizontal</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>All of these are of type <span class="code">TextAlignment</span> with values
|
||||
<span class="code">Left</span>, <span class="code">Center</span>, <span class="code">Right</span> and
|
||||
<span class="code">Default</span>.</p>
|
||||
|
||||
<p>Following properties govern vertical text alignment on different
|
||||
element types:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewColumnHeader.AlignVertical</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewGroup.HeaderAlignmentVertical</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewItem.AlignVertical</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewSubItem.AlignVertical</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>All of these are of type <span class="code">TextAlignmentVertical</span> with
|
||||
values <span class="code">Top</span>, <span class="code">Middle</span>, <span class="code">Bottom</span> and
|
||||
<span class="code">Default</span>.</p>
|
||||
|
||||
<p>The <span class="code">Default</span> value means that the alignment is
|
||||
determined from the current view default (this default alignment can also
|
||||
be modified, see <strong><em><a href="chapter-layout.html#default-alignment-trimming">Default Text
|
||||
Alignment and Trimming</a></em></strong>).</p>
|
||||
|
||||
<p>Following image shows different text alignments in the selected
|
||||
items and group:</p>
|
||||
|
||||
<p class="images"><img src="text-formatting-vertical-align.png"></p>
|
||||
|
||||
|
||||
<h2>Text Trimming</h2>
|
||||
|
||||
|
||||
<p>Text trimming is a method of shortening text when it is otherwise
|
||||
too long to be displayed in text area. There are several trimming
|
||||
options:</p>
|
||||
|
||||
<ul style="list-style:none">
|
||||
<li>
|
||||
<span class="code">None</span><ul style="list-style:none"><li>
|
||||
<p>No triming is applied and the text is just clipped,</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">Character</span><ul style="list-style:none"><li>
|
||||
<p>Text is trimmed to the last visible character.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">Word</span><ul style="list-style:none"><li>
|
||||
<p>Text is trimmed to the last visible word.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">EllipsisCharacter</span><ul style="list-style:none"><li>
|
||||
<p>Same as Character, but ellipsis (…) is added at the end of the
|
||||
text.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">EllipsisWord</span><ul style="list-style:none"><li>
|
||||
<p>Same as Word, but ellipsis (…) is added at the end of the
|
||||
text.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">EllipsisPath</span><ul style="list-style:none"><li>
|
||||
<p>Trimming for paths, the beginning and end of the path is
|
||||
retained and the ellipsis (…) is added in the middle of the
|
||||
text.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
</ul>
|
||||
<p>Here is an example of different trimming methods in action:</p>
|
||||
|
||||
<p class="images"><img src="text-formatting-trim.png"></p>
|
||||
|
||||
<p>Text trimming works also with multi-line text (see <strong><em><a href="chapter-layout.html#text-layout">Text Layout</a></em></strong>), here is
|
||||
an example of breaking text into a maximum of four lines and then trimming
|
||||
with ellipsis:</p>
|
||||
|
||||
<p class="images"><img src="text-formatting-cheader1.png"><img src="text-formatting-cheader2.png"><img src="text-formatting-cheader3.png"></p>
|
||||
|
||||
<p>Following properties on different elements govern text
|
||||
trimming:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewColumnHeader.TextTrimming</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewGroup.TextTrimming</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewItem.TextTrimming</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewSubItem.TextTrimming</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<h2>
|
||||
<a name="text-wrapping" id="text-wrapping"></a>Text Wrapping</h2>
|
||||
|
||||
|
||||
<br><hr>
|
||||
<p class="note">Text wrapping is not supported in <strong><em>Better ListView
|
||||
Express</em></strong>.</p>
|
||||
<hr>
|
||||
<br><p>Text wrapping defines how item (sub-item) text is broken in several
|
||||
lines with respect to other sub-items. This property can be set only on
|
||||
items (<span class="code">BetterListViewItem.TextTrimming</span>) and sub-items
|
||||
(<span class="code">BetterListViewSubitem.TextTrimming</span>) and the property has one
|
||||
of three values:</p>
|
||||
|
||||
<ul style="list-style:none">
|
||||
<li>Layout<ul style="list-style:none"><li>
|
||||
<p>Default value. Item (sub-item) text can be split to number of
|
||||
lines defined by <span class="code">MaximumTextLines</span> property of the
|
||||
corresponding layout (see <strong><em><a href="chapter-layout.html#text-layout">Text
|
||||
Layout</a></em></strong>).</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>Space<ul style="list-style:none"><li>
|
||||
<p>Item (sub-item) text can be split to several lines, but only
|
||||
up to available space.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>None<ul style="list-style:none"><li>
|
||||
<p>Item (sub-item) text cannot be split (single line
|
||||
only).</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
</ul>
|
||||
<p>The effect of different text wrapping modes can be seen on the
|
||||
following screenshot:</p>
|
||||
|
||||
<p class="images"><img src="text-formatting-wrap.png"></p>
|
||||
|
||||
<p>The sub-item in the first column has <span class="code">TextWrapping</span> set
|
||||
to <span class="code">Layout</span>, hence the text is split in up to four lines
|
||||
(<span class="code">MaximumTextLines</span> is <span class="code">4</span> in the sample).</p>
|
||||
|
||||
<p>The sub-item in the second column has <span class="code">TextWrapping</span> set
|
||||
to <span class="code">None</span>, hence the text not wrapped.</p>
|
||||
|
||||
<p>The sub-item in the third column has <span class="code">TextWrapping</span> set
|
||||
to <span class="code">Space</span>, so even though the text can be split to four lines,
|
||||
it can be split to only available space, which allows for only three
|
||||
lines. The available space here is governed by the first sub-item.</p>
|
||||
|
||||
|
||||
<h2>Hotkey Prefix</h2>
|
||||
|
||||
|
||||
<p>The hotkey prefix is an underlined character in item/sub-item label.
|
||||
It is indicated by ampersand (<strong><em>&</em></strong>) character before
|
||||
the character to be displayed with underline. The following picture show
|
||||
item with hotkey prefix display turned off and on:</p>
|
||||
|
||||
<p class="images"><img src="text-formatting-hotkey.png"></p>
|
||||
|
||||
<p>The hotkey prefix can be used for easier navigation in items (e.g.
|
||||
menu items) with just key presses. The actual implementation of such
|
||||
behavior is up to user, but Better ListView allows displaying hotkey
|
||||
prefixes on items and sub-items by setting
|
||||
<span class="code">BetterListViewItem.HotkeyPrefix</span>
|
||||
(<span class="code">BetterListViewSubItem.HotkeyPrefix</span>, respectively) to
|
||||
<span class="code">true</span>.</p>
|
||||
|
||||
|
||||
<h2>Font and Color</h2>
|
||||
|
||||
|
||||
<p>Column header, group, item and sub-item can have its own font and
|
||||
color:</p>
|
||||
|
||||
<p class="images"><img src="text-formatting-fontcolor.png"></p>
|
||||
|
||||
<p>Font and colors are controlled with properties <span class="code">Font</span>,
|
||||
<span class="code">ForeColor</span> and <span class="code">BackColor</span>.</p>
|
||||
|
||||
<p>By default, elements does not have a specific font and foreground
|
||||
color set and there are fallback schemes to obtain these values. The
|
||||
arrows in the schemes mean <strong><em>if not set, use the following
|
||||
value</em></strong>.</p>
|
||||
|
||||
<p>Column headers:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewColumnHeader.Font</span> →
|
||||
<span class="code">BetterListView.FontColumns</span> →
|
||||
<span class="code">BetterListView.Font</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewColumnHeader.ForeColor</span> →
|
||||
<span class="code">BetterListView.ForeColorColumns</span> →
|
||||
<span class="code">BetterListView.ForeColor</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>Groups:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewGroup.Font</span> →
|
||||
<span class="code">BetterListViewGroup.FontGroups</span> →
|
||||
<span class="code">BetterListViewGroup.DefaultFont</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewGroup.ForeColor</span> →
|
||||
<span class="code">BetterListViewGroup.ForeColorGroups</span> →
|
||||
<span class="code">BetterListViewGroup.ForeColor</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<p>Items:</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewItem.Font</span> →
|
||||
<span class="code">BetterListView.FontItems</span> →
|
||||
<span class="code">BetterListView.Font</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewItem.ForeColor</span> →
|
||||
<span class="code">BetterListView.ForeColorItems</span> →
|
||||
<span class="code">BetterListView.ForeColor</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewSubItem.Font</span> →
|
||||
<span class="code">BetterListView.FontItems</span> →
|
||||
<span class="code">BetterListView.Font</span></p>
|
||||
</li>
|
||||
<li>
|
||||
<p><span class="code">BetterListViewSubItem.ForeColor</span> →
|
||||
<span class="code">BetterListView.ForeColorItems</span> →
|
||||
<span class="code">BetterListView.ForeColor</span></p>
|
||||
</li>
|
||||
</ul>
|
||||
<br><hr>
|
||||
<p class="note">Sub-items take into acount
|
||||
<span class="code">BetterListViewItem.UseItemStyleForSubItems</span>.</p>
|
||||
<hr>
|
||||
<br><p>To better understand these schemes, look at the following sample
|
||||
code:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">// all elements will be red
|
||||
listView.ForeColor = Color.Red;
|
||||
|
||||
// ...except for column headers which will be blue
|
||||
listView.ForeColorColumns = Color.Blue;
|
||||
|
||||
// ...except for second column header, which will be green
|
||||
listView.Columns[1].ForeColor = Color.Green;</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">' all elements will be red
|
||||
listView.ForeColor = Color.Red
|
||||
|
||||
' ...except for column headers which will be blue
|
||||
listView.ForeColorColumns = Color.Blue
|
||||
|
||||
' ...except for second column header, which will be green
|
||||
listView.Columns(1).ForeColor = Color.Green</code></pre>
|
||||
|
||||
<p>The result looks like this:</p>
|
||||
|
||||
<p class="images"><img src="text-formatting-fallback.png"></p>
|
||||
|
||||
|
||||
<h2>Bold Items</h2>
|
||||
|
||||
|
||||
<p>Items and sub-items can be displayed with strong appearance using
|
||||
<span class="code">BetterListViewItem.IsBold</span> property
|
||||
(<span class="code">BetterListViewSubItem.IsBold</span>, respectively):</p>
|
||||
|
||||
<p class="images"><img src="text-formatting-isbold.png"></p>
|
||||
|
||||
<br><hr>
|
||||
<p class="note">Sub-items take into acount
|
||||
<span class="code">BetterListViewItem.UseItemStyleForSubItems</span>.</p>
|
||||
<hr>
|
||||
<br><h2>Sample Source Code</h2>
|
||||
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">//
|
||||
// create item with untrimmed text
|
||||
//
|
||||
BetterListViewItem itemNoTrim = new BetterListViewItem();
|
||||
|
||||
itemNoTrim.Text = "Label of this item does not use any trimming, so it is simply clipped.";
|
||||
// set no trimming for this item (text will be just clipped)
|
||||
itemNoTrim.TextTrimming = TextTrimming.None;
|
||||
|
||||
//
|
||||
// create item with word-trimmed text
|
||||
//
|
||||
BetterListViewItem itemTrimWord = new BetterListViewItem();
|
||||
|
||||
itemTrimWord.Text = "Label of this item is trimmed to the nearest word. Resize the window to see how this works.";
|
||||
// set trimming to whole words in this item
|
||||
itemTrimWord.TextTrimming = TextTrimming.EllipsisWord;
|
||||
|
||||
this.listView.BeginUpdate();
|
||||
|
||||
this.listView.Items.AddRange(
|
||||
new[]
|
||||
{
|
||||
itemNoTrim,
|
||||
itemTrimWord
|
||||
});
|
||||
|
||||
// resize items in Details view with content to show how the text gets trimmed
|
||||
// other way would be to add column and see text breaking when resizing the column
|
||||
this.listView.AutoSizeItemsInDetailsView = true;
|
||||
|
||||
this.listView.EndUpdate();</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">'
|
||||
' create item with untrimmed text
|
||||
'
|
||||
Dim itemNoTrim As New BetterListViewItem()
|
||||
|
||||
itemNoTrim.Text = "Label of this item does not use any trimming, so it is simply clipped."
|
||||
' set no trimming for this item (text will be just clipped)
|
||||
itemNoTrim.TextTrimming = TextTrimming.None
|
||||
|
||||
'
|
||||
' create item with word-trimmed text
|
||||
'
|
||||
Dim itemTrimWord As New BetterListViewItem()
|
||||
|
||||
itemTrimWord.Text =
|
||||
"Label of this item is trimmed to the nearest word. Resize the window to see how this works."
|
||||
' set trimming to whole words in this item
|
||||
itemTrimWord.TextTrimming = TextTrimming.EllipsisWord
|
||||
|
||||
ListView.BeginUpdate()
|
||||
|
||||
ListView.Items.AddRange (New BetterListViewItem() {itemNoTrim, itemTrimWord})
|
||||
|
||||
' resize items in Details view with content to show how the text gets trimmed
|
||||
' other way would be to add column and see text breaking when resizing the column
|
||||
ListView.AutoSizeItemsInDetailsView = True
|
||||
|
||||
ListView.EndUpdate()</code></pre>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-sub-items.html"><strong>
|
||||
« Sub-items</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-tooltips.html"><strong>Tooltips »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,337 @@
|
||||
<!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>Tooltips</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-text-formatting.html"><strong>
|
||||
« Text Formatting</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-views.html"><strong>Views »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><h1>Tooltips</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<br><hr>
|
||||
<p class="note">Inbuilt tooltips are not supported in <strong><em>Better ListView
|
||||
Express</em></strong>.</p>
|
||||
<hr>
|
||||
<br><p>Single or multiple tooltips can be displayed on any element and
|
||||
element part, or even user-defined areas.</p>
|
||||
|
||||
<p>Instead of creating <span class="code">System.Windows.Forms.ToolTip</span>
|
||||
component and attaching it to the Better ListView, every type of element has
|
||||
a <span class="code">ToolTips</span> property holding a collection of tooltip data.
|
||||
Actual tooltips are then shown using the internal mechanism of Better
|
||||
ListView.</p>
|
||||
|
||||
<p>To display automatic or custom toolips, at least one of the following
|
||||
properties should be set to <span class="code">true</span>:</p>
|
||||
|
||||
<ul style="list-style:none">
|
||||
<li>
|
||||
<span class="code">ShowToolTips</span><ul style="list-style:none"><li>
|
||||
<p>Controls displaying tooltips on items.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">ShowToolTipsColumns</span><ul style="list-style:none"><li>
|
||||
<p>Controls displaying tooltips on column headers.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">ShowToolTipsGroups</span><ul style="list-style:none"><li>
|
||||
<p>Controls displaying tooltips on groups.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">ShowToolTipsSubItems</span><ul style="list-style:none"><li>
|
||||
<p>Controls displaying tooltips on sub-items.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
</ul>
|
||||
<h2>Automatic Tooltips</h2>
|
||||
|
||||
|
||||
<p>Better ListView can show tooltips automatically when text of a
|
||||
certain element (item, sub-item, column header, group) is not fully
|
||||
visible:</p>
|
||||
|
||||
<p class="images"><img src="tooltips-auto1.png"><img src="tooltips-auto2.png"></p>
|
||||
|
||||
<p>To activate automatic tooltips, set one of the following properties
|
||||
to <span class="code">true</span>:</p>
|
||||
|
||||
<ul style="list-style:none">
|
||||
<li>
|
||||
<span class="code">AllowAutoToolTips</span><ul style="list-style:none"><li>
|
||||
<p>Allow displaying automatic tooltips on items.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">AllowAutoToolTipsColumns</span><ul style="list-style:none"><li>
|
||||
<p>Allow displaying automatic tooltips on column headers.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">AllowAutoToolTipsGroups</span><ul style="list-style:none"><li>
|
||||
<p>Allow displaying automatic tooltips on groups.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">AllowAutoToolTipsSubItems</span><ul style="list-style:none"><li>
|
||||
<p>Allow displaying automatic tooltips on sub-items.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
</ul>
|
||||
<h2>Simple Tooltips</h2>
|
||||
|
||||
|
||||
<p>To set tooltip on some element, simply add a new
|
||||
<span class="code">BetterListViewToolTipInfo</span> instance into its
|
||||
<span class="code">ToolTips</span> collection:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">item.ToolTips.Add("An item tooltip!");</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">item.ToolTips.Add("An item tooltip!")</code></pre>
|
||||
|
||||
<p>The ToolTips collection contains entries of type
|
||||
<span class="code">BetterListViewToolTipInfo</span>. It is, however, possible to add
|
||||
jsut string values, because there is an implicit conversion defined. This
|
||||
way you are able to set tooltip for the whole control:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">listView.ToolTipInfo = "Tooltip on Better ListView.";</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">listView.ToolTipInfo = "Tooltip on Better ListView."</code></pre>
|
||||
|
||||
|
||||
<h2>Tooltip Options</h2>
|
||||
|
||||
|
||||
<p>Every tooltip is described by a
|
||||
<span class="code">BetterListViewToolTipInfo</span>. This structure holds all the
|
||||
settings of the original <span class="code">System.Windows.Forms.ToolTip</span> and
|
||||
some additional ones. These are:</p>
|
||||
|
||||
<ul style="list-style:none">
|
||||
<li>
|
||||
<span class="code">Bounds</span><ul style="list-style:none"><li>
|
||||
<p>Defines custom location of the tooltip (see <strong><em><a href="chapter-tooltips.html#tooltip-locations">Tooltip Locations</a></em></strong>).</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">Location</span><ul style="list-style:none"><li>
|
||||
<p>Location of the tooltip - e.g. client area, image, custom
|
||||
rectangle...</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">ShowOnPartialTextVisibility</span><ul style="list-style:none"><li>
|
||||
<p>Display the tooltip when text of the corresponding element is
|
||||
trimmed (partially visible).</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">Text</span><ul style="list-style:none"><li>
|
||||
<p>Text of the tooltip.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">ToolTipBackColor</span>, <span class="code">ToolTipIcon</span><ul style="list-style:none"><li>
|
||||
<p>Properties of a WinForms tooltip.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
</ul>
|
||||
<p>With such settings, one can generate a tooltip like this:</p>
|
||||
|
||||
<p class="images"><img src="tooltips-baloon.png"></p>
|
||||
|
||||
|
||||
<h2>
|
||||
<a name="tooltip-locations" id="tooltip-locations"></a>Tooltip Locations</h2>
|
||||
|
||||
|
||||
<p><span class="code">BetterListViewTooltipInfo.Location</span> has these possible
|
||||
values:</p>
|
||||
|
||||
<ul style="list-style:none">
|
||||
<li>
|
||||
<span class="code">Border</span><ul style="list-style:none"><li>
|
||||
<p>Column header border.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">Client</span><ul style="list-style:none"><li>
|
||||
<p>Control client area, whole item, whole, column header
|
||||
etc.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">Custom</span><ul style="list-style:none"><li>
|
||||
<p>Custom location defined by a rectangle
|
||||
(<span class="code">BetterListViewToolTipInfo.Bounds</span> property).</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">ExpandButton</span><ul style="list-style:none"><li>
|
||||
<p>Group or item expand button.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">CheckBox</span><ul style="list-style:none"><li>
|
||||
<p>Item check box.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">Image</span><ul style="list-style:none"><li>
|
||||
<p>Element image area.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">SortGlyph</span><ul style="list-style:none"><li>
|
||||
<p>Column header sort glyph.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
<li>
|
||||
<span class="code">Text</span><ul style="list-style:none"><li>
|
||||
<p>Element text area.</p>
|
||||
</li></ul>
|
||||
</li>
|
||||
</ul>
|
||||
<p>As you can see, these values depends on context of the
|
||||
tooltip.</p>
|
||||
|
||||
<p>To set tooltip on custom location, use the following
|
||||
construct:</p>
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">columnHeader.ToolTips.Add(new BetterListViewToolTipInfo(
|
||||
new Rectangle(0, 0, 16, 16),
|
||||
"Tooltip on custom location"));</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">columnHeader.ToolTips.Add(New BetterListViewToolTipInfo(
|
||||
New Rectangle(0, 0, 16, 16),
|
||||
"Tooltip on custom location"))</code></pre>
|
||||
|
||||
<p>This will create tooltip on the 16-pixel top-left corner of a column
|
||||
header.</p>
|
||||
|
||||
|
||||
<h2>Owner-Drawn Tooltips</h2>
|
||||
|
||||
|
||||
<p>Tooltips can be further customized with owner drawing. For such
|
||||
case, tooltip has to be marked as owner-drawn (by setting
|
||||
<span class="code">BetterListViewToolTipInfo.ToolTipOwnerDraw</span> to
|
||||
<span class="code">true</span>) and <span class="code">BetterListView.DrawToolTip</span> event has
|
||||
to be handled. Here is an example of such tooltip:</p>
|
||||
|
||||
<p class="images"><img src="tooltips-ownerdraw.png"></p>
|
||||
|
||||
|
||||
<h2>Tooltip for The Whole Control</h2>
|
||||
|
||||
|
||||
<p>To display tooltip attached to the Better ListView control itself
|
||||
(not on any element), use <span class="code">BetterListView.ToolTipInfo</span>
|
||||
property.</p>
|
||||
|
||||
<p>This tooltip will be displayed when mouse cursor hovers over blank
|
||||
area of the control.</p>
|
||||
|
||||
|
||||
<h2>Sample Source Code</h2>
|
||||
|
||||
|
||||
<p><strong>C#</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-cs">this.listView.BeginUpdate();
|
||||
|
||||
//
|
||||
// create item with two tooltips
|
||||
//
|
||||
BetterListViewItem item = new BetterListViewItem();
|
||||
|
||||
item.Text = "Item with tooltips on itself and on text.";
|
||||
|
||||
// add tooltip on item area
|
||||
item.ToolTips.Add(new BetterListViewToolTipInfo(BetterListViewToolTipLocation.Client, "Tooltip on item area"));
|
||||
// add tooltip on item text area
|
||||
item.ToolTips.Add(new BetterListViewToolTipInfo(BetterListViewToolTipLocation.Text, "Tooltip on item text"));
|
||||
|
||||
// add the item
|
||||
this.listView.Items.Add(item);
|
||||
|
||||
// enable ToolTips feature
|
||||
this.listView.ShowToolTips = true;
|
||||
|
||||
this.listView.EndUpdate();</code></pre>
|
||||
|
||||
<p><strong>Visual Basic</strong></p>
|
||||
<pre class="prettyprint"><code class="lang-vb">ListView.BeginUpdate()
|
||||
|
||||
'
|
||||
' create item with two tooltips
|
||||
'
|
||||
Dim item As New BetterListViewItem()
|
||||
|
||||
item.Text = "Item with tooltips on itself and on text."
|
||||
|
||||
' add tooltip on item area
|
||||
item.ToolTips.Add (New BetterListViewToolTipInfo (BetterListViewToolTipLocation.Client, "Tooltip on item area"))
|
||||
' add tooltip on item text area
|
||||
item.ToolTips.Add (New BetterListViewToolTipInfo (BetterListViewToolTipLocation.Text, "Tooltip on item text"))
|
||||
|
||||
' add the item
|
||||
ListView.Items.Add (item)
|
||||
|
||||
' enable ToolTips feature
|
||||
ListView.ShowToolTips = True
|
||||
|
||||
ListView.EndUpdate()</code></pre>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-text-formatting.html"><strong>
|
||||
« Text Formatting</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"><a href="chapter-views.html"><strong>Views »
|
||||
</strong></a></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
@@ -0,0 +1,144 @@
|
||||
<!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>Views</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-tooltips.html"><strong>
|
||||
« Tooltips</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"></td>
|
||||
</tr></table>
|
||||
<br><h1>Views</h1>
|
||||
<div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<p>Better ListView can be display items in multiple ways called
|
||||
<strong><em>views</em></strong>. The view can be set using <span class="code">View</span>
|
||||
property. Following sections will present views supported by Better
|
||||
ListView. All views suppport <strong><em><a href="chapter-groups.html">Groups</a></em></strong>, as displayed in the
|
||||
screenshots.</p>
|
||||
|
||||
<p>Each of the view supports arbitrary image sizes and other settings
|
||||
(see <strong><em><a href="chapter-layout.html">Layout Properties</a></em></strong> for
|
||||
more information).</p>
|
||||
|
||||
<h2>Details view</h2>
|
||||
|
||||
|
||||
<p>This is the default view. .NET ListView displays items in detailed
|
||||
view only when there are some columns present as well. Better ListView,
|
||||
however, can display items in <strong><em>Details</em></strong> view even
|
||||
without columns:</p>
|
||||
|
||||
<p class="images"><img src="views-details1.png"><img src="views-details2.png"></p>
|
||||
|
||||
<p>When columns are added into the view, items can display their
|
||||
sub-items as well:</p>
|
||||
|
||||
<p class="images"><img src="views-detailscolumns1.png"><img src="views-detailscolumns2.png"></p>
|
||||
|
||||
|
||||
<h2>LargeIcon View</h2>
|
||||
|
||||
|
||||
<p>The <strong><em>LargeIcon</em></strong> view displays items with "large"
|
||||
icons (usually 32 by 32 pixels, but Better ListView supports any image
|
||||
size). Item text can be wrapped to up to four lines by default and the
|
||||
horizontal spacing between items is varied so that the items evenly fill
|
||||
client area:</p>
|
||||
|
||||
<p class="images"><img src="views-largeicon1.png"><img src="views-largeicon2.png"></p>
|
||||
|
||||
|
||||
<h2>List View</h2>
|
||||
|
||||
|
||||
<p>The <strong><em>List</em></strong> view is different from other views
|
||||
because it displays items vertically oriented. Instead of items flowing in
|
||||
left-right top-dop fashion, they are arranged in columns, The groups in
|
||||
the <strong><em>List</em></strong> view has to be oriented horizontally:</p>
|
||||
|
||||
<p class="images"><img src="views-list1.png"><img src="views-list2.png"></p>
|
||||
|
||||
|
||||
<h2>SmallIcon View</h2>
|
||||
|
||||
|
||||
<p>The <strong><em>SmallIcon</em></strong> view displays items with "small"
|
||||
icons (usually 16 by 16 pixels, but Better ListView supports any image
|
||||
size). Contrary to <strong><em>LargeIcon</em></strong> view, item text is
|
||||
placed to the right of item images:</p>
|
||||
|
||||
<p class="images"><img src="views-smallicon1.png"><img src="views-smallicon2.png"></p>
|
||||
|
||||
|
||||
<h2>Tile View</h2>
|
||||
|
||||
|
||||
<p>The <strong><em>Tile</em></strong> view displays items as "tiles", whose
|
||||
size can be adjusted by <span class="code">TileSize</span> property.
|
||||
<strong><em>Tile</em></strong> view can display sub-item texts on additional
|
||||
lines, but only item image (possible images of sub-items are
|
||||
hidden):</p>
|
||||
|
||||
<p class="images"><img src="views-tile1.png"><img src="views-tile2.png"></p>
|
||||
|
||||
|
||||
<h2>Thumbnails View</h2>
|
||||
|
||||
|
||||
<p>The <strong><em>Thubnails</em></strong> view is similar to
|
||||
<strong><em>LargeIcon</em></strong> view. Items are of the same height, there
|
||||
is a single-line text by default and the items are centered with fixed
|
||||
spacing between them:</p>
|
||||
|
||||
<p class="images"><img src="views-thumbnails1.png"><img src="views-thumbnails2.png"></p>
|
||||
|
||||
|
||||
<h2>Detecting view change</h2>
|
||||
|
||||
|
||||
<p>When the value of <span class="code">View</span> property has changed, a
|
||||
<span class="code">BetterListViewViewChanged</span> event is raised. Event data or the
|
||||
event contains old a new value of type
|
||||
<span class="code">BetterListViewView</span>.</p>
|
||||
|
||||
<br><div class="banner">
|
||||
<a href="../../../blog/page/6/index.html"><img src="../resources/overview.gif" alt="Better ListView" class="ss"></a>
|
||||
<div class="inside">
|
||||
<div class="text">Better ListView: Ultimate .NET ListView replacement control for WinForms (C#, VB.NET)</div>
|
||||
<span class="dbtn-c dbtn-hilight"><span class="dbtn-w"><a href="../../../betterlistview.exe" class="dbtn">Download</a></span></span>
|
||||
<span class="dbtn-c"><span class="dbtn-w"><a href="../../../blog/page/6/index.html" class="dbtn">More Info</a></span></span>
|
||||
</div>
|
||||
</div>
|
||||
<table class="navigation"><tr>
|
||||
<td class="navigation-previous"><a href="chapter-tooltips.html"><strong>
|
||||
« Tooltips</strong></a></td>
|
||||
<td class="navigation-index"><a href="../../../better-listview-express/documentation.html"><strong>Index</strong></a></td>
|
||||
<td class="navigation-next"></td>
|
||||
</tr></table>
|
||||
<br><table class="footer"><tr>
|
||||
<td class="footer-title">Better ListView Express Documentation
|
||||
</td>
|
||||
<td class="footer-copyright">
|
||||
Copyright © <a href="../../../index.html" target="_blank">ComponentOwl.com</a>
|
||||
</td>
|
||||
</tr></table>
|
||||
</div></body>
|
||||
</html>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 3.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 64 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 8.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1019 B |
Binary file not shown.
|
After Width: | Height: | Size: 2.4 KiB |
BIN
public/documentation/better-listview-express/data/data-sort.png
Normal file
BIN
public/documentation/better-listview-express/data/data-sort.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
BIN
public/documentation/better-listview-express/data/empty-text.png
Normal file
BIN
public/documentation/better-listview-express/data/empty-text.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 53 KiB |
BIN
public/documentation/better-listview-express/data/focus-item.png
Normal file
BIN
public/documentation/better-listview-express/data/focus-item.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 51 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 7.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 14 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 14 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.7 KiB |
BIN
public/documentation/better-listview-express/data/items-hide.png
Normal file
BIN
public/documentation/better-listview-express/data/items-hide.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.1 KiB |
BIN
public/documentation/better-listview-express/data/items-keep.png
Normal file
BIN
public/documentation/better-listview-express/data/items-keep.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 8.5 KiB |
61
public/documentation/better-listview-express/data/lang-vb.js
Normal file
61
public/documentation/better-listview-express/data/lang-vb.js
Normal file
@@ -0,0 +1,61 @@
|
||||
// Copyright (C) 2009 Google Inc.
|
||||
//
|
||||
// Licensed under the Apache License, Version 2.0 (the "License");
|
||||
// you may not use this file except in compliance with the License.
|
||||
// You may obtain a copy of the License at
|
||||
//
|
||||
// http://www.apache.org/licenses/LICENSE-2.0
|
||||
//
|
||||
// Unless required by applicable law or agreed to in writing, software
|
||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* @fileoverview
|
||||
* Registers a language handler for various flavors of basic.
|
||||
*
|
||||
*
|
||||
* To use, include prettify.js and this file in your HTML page.
|
||||
* Then put your code in an HTML tag like
|
||||
* <pre class="prettyprint lang-vb"></pre>
|
||||
*
|
||||
*
|
||||
* http://msdn.microsoft.com/en-us/library/aa711638(VS.71).aspx defines the
|
||||
* visual basic grammar lexical grammar.
|
||||
*
|
||||
* @author mikesamuel@gmail.com
|
||||
*/
|
||||
|
||||
PR['registerLangHandler'](
|
||||
PR['createSimpleLexer'](
|
||||
[
|
||||
// Whitespace
|
||||
[PR['PR_PLAIN'], /^[\t\n\r \xA0\u2028\u2029]+/, null, '\t\n\r \xA0\u2028\u2029'],
|
||||
// A double quoted string with quotes escaped by doubling them.
|
||||
// A single character can be suffixed with C.
|
||||
[PR['PR_STRING'], /^(?:[\"\u201C\u201D](?:[^\"\u201C\u201D]|[\"\u201C\u201D]{2})(?:[\"\u201C\u201D]c|$)|[\"\u201C\u201D](?:[^\"\u201C\u201D]|[\"\u201C\u201D]{2})*(?:[\"\u201C\u201D]|$))/i, null,
|
||||
'"\u201C\u201D'],
|
||||
// A comment starts with a single quote and runs until the end of the
|
||||
// line.
|
||||
[PR['PR_COMMENT'], /^[\'\u2018\u2019][^\r\n\u2028\u2029]*/, null, '\'\u2018\u2019']
|
||||
],
|
||||
[
|
||||
[PR['PR_KEYWORD'], /^(?:AddHandler|AddressOf|Alias|And|AndAlso|Ansi|As|Assembly|Auto|Boolean|ByRef|Byte|ByVal|Call|Case|Catch|CBool|CByte|CChar|CDate|CDbl|CDec|Char|CInt|Class|CLng|CObj|Const|CShort|CSng|CStr|CType|Date|Decimal|Declare|Default|Delegate|Dim|DirectCast|Do|Double|Each|Else|ElseIf|End|EndIf|Enum|Erase|Error|Event|Exit|Finally|For|Friend|Function|Get|GetType|GoSub|GoTo|Handles|If|Implements|Imports|In|Inherits|Integer|Interface|Is|Let|Lib|Like|Long|Loop|Me|Mod|Module|MustInherit|MustOverride|MyBase|MyClass|Namespace|New|Next|Not|NotInheritable|NotOverridable|Object|On|Option|Optional|Or|OrElse|Overloads|Overridable|Overrides|ParamArray|Preserve|Private|Property|Protected|Public|RaiseEvent|ReadOnly|ReDim|RemoveHandler|Resume|Return|Select|Set|Shadows|Shared|Short|Single|Static|Step|Stop|String|Structure|Sub|SyncLock|Then|Throw|To|Try|TypeOf|Unicode|Until|Variant|Wend|When|While|With|WithEvents|WriteOnly|Xor|EndIf|GoSub|Let|Variant|Wend)\b/i, null],
|
||||
// A second comment form
|
||||
[PR['PR_COMMENT'], /^REM[^\r\n\u2028\u2029]*/i],
|
||||
// A boolean, numeric, or date literal.
|
||||
[PR['PR_LITERAL'],
|
||||
/^(?:True\b|False\b|Nothing\b|\d+(?:E[+\-]?\d+[FRD]?|[FRDSIL])?|(?:&H[0-9A-F]+|&O[0-7]+)[SIL]?|\d*\.\d+(?:E[+\-]?\d+)?[FRD]?|#\s+(?:\d+[\-\/]\d+[\-\/]\d+(?:\s+\d+:\d+(?::\d+)?(\s*(?:AM|PM))?)?|\d+:\d+(?::\d+)?(\s*(?:AM|PM))?)\s+#)/i],
|
||||
// An identifier?
|
||||
[PR['PR_PLAIN'], /^(?:(?:[a-z]|_\w)\w*|\[(?:[a-z]|_\w)\w*\])/i],
|
||||
// A run of punctuation
|
||||
[PR['PR_PUNCTUATION'],
|
||||
/^[^\w\t\n\r \"\'\[\]\xA0\u2018\u2019\u201C\u201D\u2028\u2029]+/],
|
||||
// Square brackets
|
||||
[PR['PR_PUNCTUATION'], /^(?:\[|\])/]
|
||||
]),
|
||||
['vb', 'vbs']);
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 3.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 726 B |
Binary file not shown.
|
After Width: | Height: | Size: 831 B |
Binary file not shown.
|
After Width: | Height: | Size: 5.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 199 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 7.8 KiB |
BIN
public/documentation/better-listview-express/data/owner-draw.png
Normal file
BIN
public/documentation/better-listview-express/data/owner-draw.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 114 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.6 KiB |
@@ -0,0 +1,52 @@
|
||||
/* Pretty printing styles. Used with prettify.js. */
|
||||
|
||||
/* SPAN elements with the classes below are added by prettyprint. */
|
||||
.pln { color: #000 } /* plain text */
|
||||
|
||||
@media screen {
|
||||
.str { color: #080 } /* string content */
|
||||
.kwd { color: #008 } /* a keyword */
|
||||
.com { color: #800 } /* a comment */
|
||||
.typ { color: #606 } /* a type name */
|
||||
.lit { color: #066 } /* a literal value */
|
||||
/* punctuation, lisp open bracket, lisp close bracket */
|
||||
.pun, .opn, .clo { color: #660 }
|
||||
.tag { color: #008 } /* a markup tag name */
|
||||
.atn { color: #606 } /* a markup attribute name */
|
||||
.atv { color: #080 } /* a markup attribute value */
|
||||
.dec, .var { color: #606 } /* a declaration; a variable name */
|
||||
.fun { color: red } /* a function name */
|
||||
}
|
||||
|
||||
/* Use higher contrast and text-weight for printable form. */
|
||||
@media print, projection {
|
||||
.str { color: #060 }
|
||||
.kwd { color: #006; font-weight: bold }
|
||||
.com { color: #600; font-style: italic }
|
||||
.typ { color: #404; font-weight: bold }
|
||||
.lit { color: #044 }
|
||||
.pun, .opn, .clo { color: #440 }
|
||||
.tag { color: #006; font-weight: bold }
|
||||
.atn { color: #404 }
|
||||
.atv { color: #060 }
|
||||
}
|
||||
|
||||
/* Put a border around prettyprinted code snippets. */
|
||||
pre.prettyprint { padding: 2px; border: 1px solid #888 }
|
||||
|
||||
/* Specify class=linenums on a pre to get line numbering */
|
||||
ol.linenums { margin-top: 0; margin-bottom: 0 } /* IE indents via margin-left */
|
||||
li.L0,
|
||||
li.L1,
|
||||
li.L2,
|
||||
li.L3,
|
||||
li.L5,
|
||||
li.L6,
|
||||
li.L7,
|
||||
li.L8 { list-style-type: none }
|
||||
/* Alternate shading for lines */
|
||||
li.L1,
|
||||
li.L3,
|
||||
li.L5,
|
||||
li.L7,
|
||||
li.L9 { background: #eee }
|
||||
1477
public/documentation/better-listview-express/data/prettify.js
Normal file
1477
public/documentation/better-listview-express/data/prettify.js
Normal file
File diff suppressed because it is too large
Load Diff
Binary file not shown.
|
After Width: | Height: | Size: 66 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 49 KiB |
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user