Files
componentowl-astro/src/data/blog/enabling-search-highlight-in-better-listview/index.html
2026-03-24 17:00:20 +00:00

370 lines
27 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters
This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!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" lang="en-US">
<head profile="http://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="blogcatalog" content="9BC9953358" />
<title>Enabling Search Highlight in Better ListView &laquo; Owl&#039;s Blog on .NET development</title>
<link rel="stylesheet" href="wp-content/themes/componentowl/style.css" type="text/css" media="screen" />
<link rel="pingback" href="xmlrpc.php.html" />
<link rel='dns-prefetch' href='http://s.w.org/' />
<link rel="alternate" type="application/rss+xml" title="Owl&#039;s Blog on .NET development &raquo; Feed" href="feed/index.html" />
<link rel="alternate" type="application/rss+xml" title="Owl&#039;s Blog on .NET development &raquo; Comments Feed" href="comments/feed/index.html" />
<link rel="alternate" type="application/rss+xml" title="Owl&#039;s Blog on .NET development &raquo; Enabling Search Highlight in Better ListView Comments Feed" href="enabling-search-highlight-in-better-listview/feed/index.html" />
<script type="text/javascript">
window._wpemojiSettings = {"baseUrl":"https:\/\/s.w.org\/images\/core\/emoji\/11\/72x72\/","ext":".png","svgUrl":"https:\/\/s.w.org\/images\/core\/emoji\/11\/svg\/","svgExt":".svg","source":{"concatemoji":"http:\/\/www.componentowl.com\/blog\/wp-includes\/js\/wp-emoji-release.min.js?ver=4.9.8"}};
!function(a,b,c){function d(a,b){var c=String.fromCharCode;l.clearRect(0,0,k.width,k.height),l.fillText(c.apply(this,a),0,0);var d=k.toDataURL();l.clearRect(0,0,k.width,k.height),l.fillText(c.apply(this,b),0,0);var e=k.toDataURL();return d===e}function e(a){var b;if(!l||!l.fillText)return!1;switch(l.textBaseline="top",l.font="600 32px Arial",a){case"flag":return!(b=d([55356,56826,55356,56819],[55356,56826,8203,55356,56819]))&&(b=d([55356,57332,56128,56423,56128,56418,56128,56421,56128,56430,56128,56423,56128,56447],[55356,57332,8203,56128,56423,8203,56128,56418,8203,56128,56421,8203,56128,56430,8203,56128,56423,8203,56128,56447]),!b);case"emoji":return b=d([55358,56760,9792,65039],[55358,56760,8203,9792,65039]),!b}return!1}function f(a){var c=b.createElement("script");c.src=a,c.defer=c.type="text/javascript",b.getElementsByTagName("head")[0].appendChild(c)}var g,h,i,j,k=b.createElement("canvas"),l=k.getContext&&k.getContext("2d");for(j=Array("flag","emoji"),c.supports={everything:!0,everythingExceptFlag:!0},i=0;i<j.length;i++)c.supports[j[i]]=e(j[i]),c.supports.everything=c.supports.everything&&c.supports[j[i]],"flag"!==j[i]&&(c.supports.everythingExceptFlag=c.supports.everythingExceptFlag&&c.supports[j[i]]);c.supports.everythingExceptFlag=c.supports.everythingExceptFlag&&!c.supports.flag,c.DOMReady=!1,c.readyCallback=function(){c.DOMReady=!0},c.supports.everything||(h=function(){c.readyCallback()},b.addEventListener?(b.addEventListener("DOMContentLoaded",h,!1),a.addEventListener("load",h,!1)):(a.attachEvent("onload",h),b.attachEvent("onreadystatechange",function(){"complete"===b.readyState&&c.readyCallback()})),g=c.source||{},g.concatemoji?f(g.concatemoji):g.wpemoji&&g.twemoji&&(f(g.twemoji),f(g.wpemoji)))}(window,document,window._wpemojiSettings);
</script>
<style type="text/css">
img.wp-smiley,
img.emoji {
display: inline !important;
border: none !important;
box-shadow: none !important;
height: 1em !important;
width: 1em !important;
margin: 0 .07em !important;
vertical-align: -0.1em !important;
background: none !important;
padding: 0 !important;
}
</style>
<script type='text/javascript' src='wp-includes/js/jquery/jquery.js%3Fver=1.12.4'></script>
<script type='text/javascript' src='wp-includes/js/jquery/jquery-migrate.min.js%3Fver=1.4.1'></script>
<link rel='https://api.w.org/' href='wp-json/index.html' />
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="xmlrpc.php%3Frsd" />
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="wp-includes/wlwmanifest.xml" />
<meta name="generator" content="WordPress 4.9.8" />
<link rel="canonical" href="/blog/enabling-search-highlight-in-better-listview" />
<link rel="alternate" type="application/json+oembed" href="wp-json/oembed/1.0/embed%3Furl=http:%252F%252Fwww.componentowl.com%252Fblog%252Fenabling-search-highlight-in-better-listview%252F.html" />
<link rel="alternate" type="text/xml+oembed" href="wp-json/oembed/1.0/embed%3Furl=http:%252F%252Fwww.componentowl.com%252Fblog%252Fenabling-search-highlight-in-better-listview%252F&amp;format=xml.html" />
<script type="text/javascript" src="/javascripts/plugins/jquery.validation.js"></script>
<script type="text/javascript" src="/javascripts/dextronet.js"></script>
<script type="text/javascript" src="wp-content/themes/componentowl/javascripts/theme.js"></script>
<!--[if IE 6]>
<style type="text/css">
#d-menu .dropdown .outer { background-image: none; }
#d-menu .dropdown .shadowbox { background-image: none; }
</style>
<![endif]-->
</head>
<body class="post-template-default single single-post postid-843 single-format-standard">
<div class="d-page">
<div class="d-placing">
<div class="d-content-wrap">
<div class="d-main">
<h1 class="blog-name"><a href="/blog">Owl&#039;s Blog on .NET development</a></h1>
<div class="blog-description">Component Owl codes Better ListView control all night so you don&#039;t have to.</div>
<div class="post-843 post type-post status-publish format-standard hentry category-better-listview category-components category-tutorials tag-better tag-better-listview-2 tag-highlight tag-highlighting tag-items tag-list tag-listview tag-mark tag-matched tag-search tag-searching" id="post-843">
<h2>Enabling Search Highlight in Better ListView</h2>
<p class="postmetadata">
Blog Post by Libor Tinka published on Friday, 11 January 2013 in <a href="category/better-listview/index.html" rel="category tag">Better ListView</a>, <a href="category/components/index.html" rel="category tag">Components</a>, <a href="category/tutorials/index.html" rel="category tag">Tutorials</a> </p>
<div class="entry">
<p>We have improved <a href="wp-content/uploads/2013/01/chapter-search.html">item searching</a> capabilities of <a href="page/6/index.html">Better ListView</a> by introducing <strong>Search Highlight</strong> feature. This feature automatically shows search matches and works out of the box with both searching by typing and searching from code (e.g. using search box):</p>
<div id="attachment_844" style="width: 358px" class="wp-caption aligncenter"><a href="wp-content/uploads/2013/01/search-highlight-1.gif"><img class="size-full wp-image-844" title="Search Highlight Feature" src="wp-content/uploads/2013/01/search-highlight-1.gif" alt="Search Highlight Feature" width="348" height="193" /></a><p class="wp-caption-text">Search Highlight Feature</p></div>
<p>&nbsp;</p>
<p>To enable the highlight, simply add <strong>UpdateSearchHighlight</strong> option in the search settings:</p>
<p><strong>C#</strong></p>
<p>[csharp gutter=&#8221;false&#8221; toolbar=&#8221;false&#8221;]<br />
listView.SearchSettings = new BetterListViewSearchSettings(<br />
listView.SearchSettings.Mode,<br />
listView.SearchSettings.Options | BetterListViewSearchOptions.UpdateSearchHighlight,<br />
listView.SearchSettings.SubItemIndices);<br />
[/csharp]</p>
<p><strong>Visual Basic</strong></p>
<p>[vb gutter=&#8221;false&#8221; toolbar=&#8221;false&#8221;]<br />
ListView.SearchSettings = New BetterListViewSearchSettings(<br />
listView.SearchSettings.Mode,<br />
listView.SearchSettings.Options Or BetterListViewSearchOptions.UpdateSearchHighlight,<br />
listView.SearchSettings.SubItemIndices)<br />
[/vb]</p>
<p>Every item contains information about the match in the <strong>BetterListViewItem.SearchHighlight</strong> property. When <strong>BetterListViewItem.SearchHighlight.IsEmpty</strong> is <strong>true</strong>, the item was not matched by the search. Otherwise it contains information about the matched substring: its index and number of characters.</p>
<p>Highlight colors can be adjusted by three properties: <strong>ColorSearchHighlight</strong>, <strong>ColorSearchHighlightBorder</strong> and <strong>ColorSearchHighlightText</strong>:</p>
<div id="attachment_846" style="width: 337px" class="wp-caption aligncenter"><a href="wp-content/uploads/2013/01/properties.png"><img class="size-full wp-image-846" title="Search Highlight Properties" src="wp-content/uploads/2013/01/properties.png" alt="Search Highlight Properties" width="327" height="352" /></a><p class="wp-caption-text">Search Highlight Properties</p></div>
<p>The display can be adjusted even further with owner drawing:</p>
<div id="attachment_845" style="width: 358px" class="wp-caption aligncenter"><a href="wp-content/uploads/2013/01/search-highlight-2.gif"><img class="size-full wp-image-845" title="Customized Search Highlight Feature" src="wp-content/uploads/2013/01/search-highlight-2.gif" alt="Customized Search Highlight Feature" width="348" height="193" /></a><p class="wp-caption-text">Customized Search Highlight Feature</p></div>
<p>Here we have used ellipses drawn on item background by modifying <strong>OnDrawItem</strong> and <strong>OnDrawItemBackground</strong> methods of <strong>BetterListView</strong>:</p>
<p><strong>C#</strong></p>
<p>[csharp gutter=&#8221;false&#8221; toolbar=&#8221;false&#8221;]<br />
using System.Drawing;<br />
using System.Drawing.Drawing2D;</p>
<p>using BetterListView;</p>
<p>internal sealed class CustomListView : BetterListView<br />
{<br />
protected override void OnDrawItem(BetterListViewDrawItemEventArgs eventArgs)<br />
{<br />
// do not draw search highlight because we will draw our own<br />
eventArgs.DrawSearchHighlight = false;</p>
<p> base.OnDrawItem(eventArgs);<br />
}</p>
<p> protected override void OnDrawItemBackground(BetterListViewDrawItemBackgroundEventArgs eventArgs)<br />
{<br />
base.OnDrawItemBackground(eventArgs);</p>
<p> // draw custom search highlight on item background<br />
BetterListViewSearchHighlight searchHighlight = eventArgs.Item.SearchHighlight;</p>
<p> if (searchHighlight.IsEmpty == false)<br />
{<br />
eventArgs.Graphics.SmoothingMode = SmoothingMode.HighQuality;</p>
<p> Rectangle rectHighlight = eventArgs.ItemBounds.SubItemBounds[searchHighlight.ColumnIndex].BoundsSearchHighlight;</p>
<p> Brush brushHighlight = new SolidBrush(Color.FromArgb(128, Color.MediumPurple));<br />
Pen penHighlight = new Pen(Color.Purple, 1.0f);</p>
<p> eventArgs.Graphics.FillEllipse(brushHighlight, rectHighlight);<br />
eventArgs.Graphics.DrawEllipse(penHighlight, rectHighlight);</p>
<p> brushHighlight.Dispose();<br />
penHighlight.Dispose();<br />
}<br />
}<br />
}<br />
[/csharp]</p>
<p><strong>Visual Basic</strong></p>
<p>[vb gutter=&#8221;false&#8221; toolbar=&#8221;false&#8221;]<br />
Imports System.Drawing<br />
Imports System.Drawing.Drawing2D</p>
<p>Imports BetterListView</p>
<p>Friend NotInheritable Class CustomListView<br />
Inherits BetterListView<br />
Protected Overrides Sub OnDrawItem(eventArgs As BetterListViewDrawItemEventArgs)<br />
&#8216; do not draw search highlight because we will draw our own<br />
eventArgs.DrawSearchHighlight = False</p>
<p> MyBase.OnDrawItem(eventArgs)<br />
End Sub</p>
<p> Protected Overrides Sub OnDrawItemBackground(eventArgs As BetterListViewDrawItemBackgroundEventArgs)<br />
MyBase.OnDrawItemBackground(eventArgs)</p>
<p> &#8216; draw custom search highlight on item background<br />
Dim searchHighlight As BetterListViewSearchHighlight = eventArgs.Item.SearchHighlight</p>
<p> If searchHighlight.IsEmpty = False Then<br />
eventArgs.Graphics.SmoothingMode = SmoothingMode.HighQuality</p>
<p> Dim rectHighlight As Rectangle = eventArgs.ItemBounds.SubItemBounds(searchHighlight.ColumnIndex).BoundsSearchHighlight</p>
<p> Dim brushHighlight As Brush = New SolidBrush(Color.FromArgb(128, Color.MediumPurple))<br />
Dim penHighlight As New Pen(Color.Purple, 1F)</p>
<p> eventArgs.Graphics.FillEllipse(brushHighlight, rectHighlight)<br />
eventArgs.Graphics.DrawEllipse(penHighlight, rectHighlight)</p>
<p> brushHighlight.Dispose()<br />
penHighlight.Dispose()<br />
End If<br />
End Sub<br />
End Class<br />
[/vb]</p>
</div>
<div class="postinfobar">
<span class="tags">Tags: <a href="tag/better/index.html" rel="tag">better</a>, <a href="tag/better-listview-2/index.html" rel="tag">better listview</a>, <a href="tag/highlight/index.html" rel="tag">highlight</a>, <a href="tag/highlighting/index.html" rel="tag">highlighting</a>, <a href="tag/items/index.html" rel="tag">items</a>, <a href="tag/list/index.html" rel="tag">list</a>, <a href="tag/listview/index.html" rel="tag">listview</a>, <a href="tag/mark/index.html" rel="tag">mark</a>, <a href="tag/matched/index.html" rel="tag">matched</a>, <a href="tag/search/index.html" rel="tag">search</a>, <a href="tag/searching/index.html" rel="tag">searching</a> </span>
</div>
</div>
<!-- You can start editing here. -->
<h3 id="comments">One Response to &#8220;Enabling Search Highlight in Better ListView&#8221;</h3>
<ol class="commentlist">
<li class="comment even thread-even depth-1" id="comment-1290">
<div id="div-comment-1290" class="comment-body">
<div class="comment-author vcard">
<img alt='' src='http://0.gravatar.com/avatar/364470c76d091f4974fe28b31aef6456?s=32&#038;d=retro&#038;r=g' srcset="http://0.gravatar.com/avatar/364470c76d091f4974fe28b31aef6456?s=64&#038;d=retro&#038;r=g 2x" class='avatar avatar-32 photo' height='32' width='32' /> <cite class="fn">Camiel Hessels</cite> <span class="says">says:</span> </div>
<div class="comment-meta commentmetadata"><a href="/blog/enabling-search-highlight-in-better-listview#comment-1290">
January 28, 2013 at 7:54 pm</a> </div>
<p>Awesome, just what I need! Thanks!</p>
<div class="reply"></div>
</div>
</li><!-- #comment-## -->
</ol>
<div class="navigation">
<div class="alignleft"></div>
<div class="alignright"></div>
</div>
<div id="respond">
<h3>Leave a Reply</h3>
<div class="cancel-comment-reply">
<small><a rel="nofollow" id="cancel-comment-reply-link" href="/blog/enabling-search-highlight-in-better-listview#respond" style="display:none;">Click here to cancel reply.</a></small>
</div>
<form action="http://www.componentowl.com/blog/wp-comments-post.php" method="post" id="commentform">
<p><input type="text" name="author" id="author" value="" size="22" tabindex="1" aria-required='true' />
<label for="author"><small>Name (required)</small></label></p>
<p><input type="text" name="email" id="email" value="" size="22" tabindex="2" aria-required='true' />
<label for="email"><small>Mail (will not be published) (required)</small></label></p>
<p><input type="text" name="url" id="url" value="" size="22" tabindex="3" />
<label for="url"><small>Website</small></label></p>
<!--<p><small><strong>XHTML:</strong> You can use these tags: <code>&lt;a href=&quot;&quot; title=&quot;&quot;&gt; &lt;abbr title=&quot;&quot;&gt; &lt;acronym title=&quot;&quot;&gt; &lt;b&gt; &lt;blockquote cite=&quot;&quot;&gt; &lt;cite&gt; &lt;code&gt; &lt;del datetime=&quot;&quot;&gt; &lt;em&gt; &lt;i&gt; &lt;q cite=&quot;&quot;&gt; &lt;s&gt; &lt;strike&gt; &lt;strong&gt; </code></small></p>-->
<p><textarea name="comment" id="comment" cols="58" rows="10" tabindex="4"></textarea></p>
<p><input name="submit" type="submit" id="submit" tabindex="5" value="Submit Comment" />
<input type='hidden' name='comment_post_ID' value='843' id='comment_post_ID' />
<input type='hidden' name='comment_parent' id='comment_parent' value='0' />
</p>
<p style="display: none;"><input type="hidden" id="akismet_comment_nonce" name="akismet_comment_nonce" value="fd5308c02d" /></p><p style="display: none;"><input type="hidden" id="ak_js" name="ak_js" value="122"/></p>
</form>
</div>
</div>
<div class="d-sidebar">
<div class="dextronet-feeds">
<ul class="links">
<li><a href="feed/index.html" class="rss">Subscribe to our RSS</a></li>
<li><a href="http://twitter.com/ComponentOwl" class="twitter">Follow us on twitter</a></li>
<li><a href="http://facebook.com/ComponentOwl" class="facebook">Follow us on Facebook</a></li>
</ul>
</div>
<form role="search" method="get" id="searchform-sidebar" action="../blog.html" >
<div><label class="screen-reader-text" for="s-sidebar">Search for:</label>
<input type="text" value="Search..." name="s" id="s-sidebar" class="search inline-label" />
<input type="image" id="searchsubmit-sidebar" src="wp-content/themes/componentowl/images/search.gif" value="Search" />
</div>
</form>
<div id="sidebar" role="complementary">
<ul>
<li id="categories-3" class="widget widget_categories"><h2 class="widgettitle">Categories</h2> <ul>
<li class="cat-item cat-item-3"><a href="category/announcements/index.html" >Announcements</a> (8)
</li>
<li class="cat-item cat-item-21"><a href="category/better-listview/index.html" >Better ListView</a> (44)
</li>
<li class="cat-item cat-item-4"><a href="category/components/index.html" >Components</a> (9)
</li>
<li class="cat-item cat-item-222"><a href="category/programming/index.html" >Programming</a> (2)
</li>
<li class="cat-item cat-item-13"><a href="category/tutorials/index.html" >Tutorials</a> (19)
</li>
</ul>
</li><li id="archives-3" class="widget widget_archive"><h2 class="widgettitle">Archives</h2> <ul>
<li><a href='2017/03/index.html'>March 2017</a></li>
<li><a href='2017/02/index.html'>February 2017</a></li>
<li><a href='2016/11/index.html'>November 2016</a></li>
<li><a href='2014/08/index.html'>August 2014</a></li>
<li><a href='2014/07/index.html'>July 2014</a></li>
<li><a href='2014/04/index.html'>April 2014</a></li>
<li><a href='2014/02/index.html'>February 2014</a></li>
<li><a href='2013/03/index.html'>March 2013</a></li>
<li><a href='2013/02/index.html'>February 2013</a></li>
<li><a href='2013/01/index.html'>January 2013</a></li>
<li><a href='2012/12/index.html'>December 2012</a></li>
<li><a href='2012/09/index.html'>September 2012</a></li>
<li><a href='2012/08/index.html'>August 2012</a></li>
<li><a href='2012/04/index.html'>April 2012</a></li>
<li><a href='2012/03/index.html'>March 2012</a></li>
<li><a href='2012/02/index.html'>February 2012</a></li>
<li><a href='2012/01/index.html'>January 2012</a></li>
<li><a href='2011/12/index.html'>December 2011</a></li>
<li><a href='2011/11/index.html'>November 2011</a></li>
<li><a href='2011/10/index.html'>October 2011</a></li>
<li><a href='2011/09/index.html'>September 2011</a></li>
<li><a href='2011/08/index.html'>August 2011</a></li>
<li><a href='2011/07/index.html'>July 2011</a></li>
<li><a href='2011/06/index.html'>June 2011</a></li>
<li><a href='2011/05/index.html'>May 2011</a></li>
<li><a href='2011/03/index.html'>March 2011</a></li>
<li><a href='2011/02/index.html'>February 2011</a></li>
<li><a href='2011/01/index.html'>January 2011</a></li>
</ul>
</li><li id="tag_cloud-3" class="widget widget_tag_cloud"><h2 class="widgettitle">Tags</h2><div class="tagcloud"><a href="tag/align/index.html" class="tag-cloud-link tag-link-256 tag-link-position-1" style="font-size: 8pt;" aria-label="align (2 items)">align</a>
<a href="tag/better/index.html" class="tag-cloud-link tag-link-71 tag-link-position-2" style="font-size: 14.326923076923pt;" aria-label="better (8 items)">better</a>
<a href="tag/better-listview-2/index.html" class="tag-cloud-link tag-link-31 tag-link-position-3" style="font-size: 22pt;" aria-label="better listview (32 items)">better listview</a>
<a href="tag/bound/index.html" class="tag-cloud-link tag-link-85 tag-link-position-4" style="font-size: 8pt;" aria-label="bound (2 items)">bound</a>
<a href="tag/child-items-in-listview/index.html" class="tag-cloud-link tag-link-57 tag-link-position-5" style="font-size: 8pt;" aria-label="child items in listview (2 items)">child items in listview</a>
<a href="tag/column/index.html" class="tag-cloud-link tag-link-89 tag-link-position-6" style="font-size: 10.961538461538pt;" aria-label="column (4 items)">column</a>
<a href="tag/coming-soon/index.html" class="tag-cloud-link tag-link-52 tag-link-position-7" style="font-size: 8pt;" aria-label="coming soon (2 items)">coming soon</a>
<a href="tag/custom/index.html" class="tag-cloud-link tag-link-12 tag-link-position-8" style="font-size: 15pt;" aria-label="custom (9 items)">custom</a>
<a href="tag/data/index.html" class="tag-cloud-link tag-link-84 tag-link-position-9" style="font-size: 8pt;" aria-label="data (2 items)">data</a>
<a href="tag/databinding/index.html" class="tag-cloud-link tag-link-83 tag-link-position-10" style="font-size: 8pt;" aria-label="databinding (2 items)">databinding</a>
<a href="tag/drawing/index.html" class="tag-cloud-link tag-link-161 tag-link-position-11" style="font-size: 10.961538461538pt;" aria-label="drawing (4 items)">drawing</a>
<a href="tag/drawn/index.html" class="tag-cloud-link tag-link-270 tag-link-position-12" style="font-size: 9.6153846153846pt;" aria-label="drawn (3 items)">drawn</a>
<a href="tag/explorer/index.html" class="tag-cloud-link tag-link-30 tag-link-position-13" style="font-size: 9.6153846153846pt;" aria-label="explorer (3 items)">explorer</a>
<a href="tag/groups/index.html" class="tag-cloud-link tag-link-22 tag-link-position-14" style="font-size: 10.961538461538pt;" aria-label="groups (4 items)">groups</a>
<a href="tag/header/index.html" class="tag-cloud-link tag-link-134 tag-link-position-15" style="font-size: 9.6153846153846pt;" aria-label="header (3 items)">header</a>
<a href="tag/hide/index.html" class="tag-cloud-link tag-link-88 tag-link-position-16" style="font-size: 10.961538461538pt;" aria-label="hide (4 items)">hide</a>
<a href="tag/hiding/index.html" class="tag-cloud-link tag-link-90 tag-link-position-17" style="font-size: 9.6153846153846pt;" aria-label="hiding (3 items)">hiding</a>
<a href="tag/hierarchy/index.html" class="tag-cloud-link tag-link-24 tag-link-position-18" style="font-size: 8pt;" aria-label="hierarchy (2 items)">hierarchy</a>
<a href="tag/hot/index.html" class="tag-cloud-link tag-link-106 tag-link-position-19" style="font-size: 9.6153846153846pt;" aria-label="hot (3 items)">hot</a>
<a href="tag/image/index.html" class="tag-cloud-link tag-link-277 tag-link-position-20" style="font-size: 8pt;" aria-label="image (2 items)">image</a>
<a href="tag/images/index.html" class="tag-cloud-link tag-link-7 tag-link-position-21" style="font-size: 9.6153846153846pt;" aria-label="images (3 items)">images</a>
<a href="tag/item/index.html" class="tag-cloud-link tag-link-23 tag-link-position-22" style="font-size: 10.961538461538pt;" aria-label="item (4 items)">item</a>
<a href="tag/item-hierarchy/index.html" class="tag-cloud-link tag-link-55 tag-link-position-23" style="font-size: 8pt;" aria-label="item hierarchy (2 items)">item hierarchy</a>
<a href="tag/items/index.html" class="tag-cloud-link tag-link-107 tag-link-position-24" style="font-size: 17.423076923077pt;" aria-label="items (14 items)">items</a>
<a href="tag/listview/index.html" class="tag-cloud-link tag-link-5 tag-link-position-25" style="font-size: 16.076923076923pt;" aria-label="listview (11 items)">listview</a>
<a href="tag/load/index.html" class="tag-cloud-link tag-link-261 tag-link-position-26" style="font-size: 8pt;" aria-label="load (2 items)">load</a>
<a href="tag/mouse/index.html" class="tag-cloud-link tag-link-41 tag-link-position-27" style="font-size: 8pt;" aria-label="mouse (2 items)">mouse</a>
<a href="tag/multi-line/index.html" class="tag-cloud-link tag-link-82 tag-link-position-28" style="font-size: 8pt;" aria-label="multi-line (2 items)">multi-line</a>
<a href="tag/multiline/index.html" class="tag-cloud-link tag-link-81 tag-link-position-29" style="font-size: 9.6153846153846pt;" aria-label="multiline (3 items)">multiline</a>
<a href="tag/owner/index.html" class="tag-cloud-link tag-link-104 tag-link-position-30" style="font-size: 12.038461538462pt;" aria-label="owner (5 items)">owner</a>
<a href="tag/ownerdrawn/index.html" class="tag-cloud-link tag-link-273 tag-link-position-31" style="font-size: 8pt;" aria-label="ownerdrawn (2 items)">ownerdrawn</a>
<a href="tag/padding/index.html" class="tag-cloud-link tag-link-19 tag-link-position-32" style="font-size: 8pt;" aria-label="padding (2 items)">padding</a>
<a href="tag/progress/index.html" class="tag-cloud-link tag-link-37 tag-link-position-33" style="font-size: 8pt;" aria-label="progress (2 items)">progress</a>
<a href="tag/space/index.html" class="tag-cloud-link tag-link-240 tag-link-position-34" style="font-size: 9.6153846153846pt;" aria-label="space (3 items)">space</a>
<a href="tag/spacing/index.html" class="tag-cloud-link tag-link-20 tag-link-position-35" style="font-size: 8pt;" aria-label="spacing (2 items)">spacing</a>
<a href="tag/sub-item/index.html" class="tag-cloud-link tag-link-113 tag-link-position-36" style="font-size: 10.961538461538pt;" aria-label="sub-item (4 items)">sub-item</a>
<a href="tag/sub-items/index.html" class="tag-cloud-link tag-link-265 tag-link-position-37" style="font-size: 8pt;" aria-label="sub-items (2 items)">sub-items</a>
<a href="tag/subitem/index.html" class="tag-cloud-link tag-link-258 tag-link-position-38" style="font-size: 9.6153846153846pt;" aria-label="subitem (3 items)">subitem</a>
<a href="tag/subitems/index.html" class="tag-cloud-link tag-link-266 tag-link-position-39" style="font-size: 9.6153846153846pt;" aria-label="subitems (3 items)">subitems</a>
<a href="tag/thumbnails/index.html" class="tag-cloud-link tag-link-6 tag-link-position-40" style="font-size: 8pt;" aria-label="thumbnails (2 items)">thumbnails</a>
<a href="tag/tree/index.html" class="tag-cloud-link tag-link-80 tag-link-position-41" style="font-size: 8pt;" aria-label="tree (2 items)">tree</a>
<a href="tag/update/index.html" class="tag-cloud-link tag-link-36 tag-link-position-42" style="font-size: 8pt;" aria-label="update (2 items)">update</a>
<a href="tag/whats-new/index.html" class="tag-cloud-link tag-link-32 tag-link-position-43" style="font-size: 8pt;" aria-label="what&#039;s new (2 items)">what&#039;s new</a>
<a href="tag/working-on/index.html" class="tag-cloud-link tag-link-38 tag-link-position-44" style="font-size: 8pt;" aria-label="working on (2 items)">working on</a>
<a href="tag/xp/index.html" class="tag-cloud-link tag-link-29 tag-link-position-45" style="font-size: 8pt;" aria-label="xp (2 items)">xp</a></div>
</li> </ul>
</div>
</div>
</div>
</div>
<script type='text/javascript' src='wp-includes/js/comment-reply.min.js%3Fver=4.9.8'></script>
<script type='text/javascript' src='wp-includes/js/wp-embed.min.js%3Fver=4.9.8'></script>
<script async="async" type='text/javascript' src='wp-content/plugins/akismet/_inc/form.js%3Fver=4.0.8'></script>
</div>
</body>
</html>
<!--
Performance optimized by W3 Total Cache. Learn more: https://www.w3-edge.com/products/
Content Delivery Network via Amazon Web Services: S3: www.componentowl.com
Served from: www.componentowl.com @ 2018-09-08 11:39:11 by W3 Total Cache
-->