Skip to content

Commit e639668

Browse files
authored
Merge pull request #641 from telerik/new-kb-checkeddropdownlist-enlarge-checkboxes-f61d4e8c4a034490bd6cbf46ac23e79c
Added new kb article checkeddropdownlist-enlarge-checkboxes
2 parents 889dff4 + 4ce6bff commit e639668

File tree

1 file changed

+55
-0
lines changed

1 file changed

+55
-0
lines changed
Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
---
2+
title: Enlarging Checkboxes Within RadCheckedDropDownList Items
3+
description: Learn how to increase the size of checkboxes in the dropdown items of a RadCheckedDropDownList.
4+
type: how-to
5+
page_title: How to Increase Checkboxes Size in RadCheckedDropDownList Items
6+
slug: checkeddropdownlist-enlarge-checkboxes
7+
tags: dropdownlistcontrolandcheckeddropdownlist, checkbox, size, dropdownlistitem, visualitemformatting
8+
res_type: kb
9+
ticketid: 1666283
10+
---
11+
12+
## Environment
13+
14+
|Product Version|Product|Author|
15+
|----|----|----|
16+
|2024.3.806|RadCheckedDropDownList for WinForms|[Dinko Krastev](https://www.telerik.com/blogs/author/dinko-krastev)|
17+
18+
## Description
19+
Adjusting the size of checkboxes within the dropdown items of a RadCheckedDropDownList can enhance the visual appeal and usability of the application. This article demonstrates how to increase the size of checkboxes alongside adjusting the height of the dropdown items for better alignment and visibility.
20+
21+
## Solution
22+
23+
To enlarge the checkboxes within the dropdown items and adjust their alignment, follow these steps:
24+
25+
1. Increase the item height in the dropdown list to provide sufficient space for the larger checkbox.
26+
27+
````C#
28+
this.radCheckedDropDownList1.DropDownListElement.ListElement.ItemHeight = 35;
29+
30+
````
31+
32+
2. Subscribe to the `VisualListItemFormatting` event of the RadCheckedDropDownList. This event allows you to customize the appearance of each item in the dropdown list.
33+
34+
3. Within the event handler, access the checkbox element of each item and set the minimum size for the checkbox image. Additionally, the center aligns the text of the item for better visual alignment.
35+
36+
````C#
37+
private void radCheckedDropDownList1_VisualListItemFormatting(object sender, VisualItemFormattingEventArgs args)
38+
{
39+
RadCheckedListDataItem checkedItem = args.VisualItem.Data as RadCheckedListDataItem;
40+
if (checkedItem != null)
41+
{
42+
RadCheckedListVisualItem visualItem = args.VisualItem as RadCheckedListVisualItem;
43+
RadCheckBoxElement checkBoxElement = visualItem.CheckBox as RadCheckBoxElement;
44+
checkBoxElement.CheckMarkPrimitive.ImageElement.MinSize = new Size(20,20);
45+
visualItem.Label.TextAlignment = ContentAlignment.MiddleCenter;
46+
}
47+
}
48+
49+
````
50+
51+
## See Also
52+
53+
- [RadCheckedDropDownList Overview](https://docs.telerik.com/devtools/winforms/controls/checkeddropdownlist/overview)
54+
- [Customizing Appearance](https://docs.telerik.com/devtools/winforms/controls/checkeddropdownlist/customizing-appearance)
55+
- [Handling Events](https://docs.telerik.com/devtools/winforms/controls/checkeddropdownlist/events)

0 commit comments

Comments
 (0)