How to make radlistivew's dock to fill?

3 posts, 1 answers
  1. Paul
    Paul avatar
    34 posts
    Member since:
    Apr 2017

    Posted 17 May 2017 Link to this post


    I tried to use RadListView to make component just like user preference.

    The idea are:

    1. We have dynamic columns to display in a table (RadGridView)
    2. We have a list of user preference for these columns and user can change the position of columns by change the position of user preference

    Then in step 2, I tried to use RadListView to display a list of user preference with checkboxes, drag/ drop feature to support these requiredment

    But when I open this RadListView, if there are many preferences (one preference is one column) then RadListView have a scrollbar and have padding bottom too long (attachment #1) although it have space to display items. Then I have to scroll down to view.

    My question is, how to remove this long padding?

    My video to demonstrate is:

    My code are:

    private RadListView lvUserPreference = new RadListView();
    // Styles
    lvUserPreference.Dock = System.Windows.Forms.DockStyle.Fill;
    lvUserPreference.Margin = new System.Windows.Forms.Padding(0);
    lvUserPreference.Name = "lvUserPreference";
    lvUserPreference.ListViewElement.DrawBorder = false;
    lvUserPreference.ShowCheckBoxes = true;
    lvUserPreference.ViewType = ListViewType.ListView;
    lvUserPreference.AllowDragDrop = true;
    lvUserPreference.Padding = new Padding(20);
    lvUserPreference.Margin = Padding.Empty;
    lvUserPreference.ItemSpacing = 15;
    lvUserPreference.AllowEdit = false;
    lvUserPreference.AutoScroll = true;
    lvUserPreference.ListViewElement.DragDropService.PreviewDragStart -= OnPreviewDragStart;
    lvUserPreference.ListViewElement.DragDropService.PreviewDragStart += OnPreviewDragStart;
    lvUserPreference.ListViewElement.DragDropService.PreviewDragOver -= OnPreviewDragOver;
    lvUserPreference.ListViewElement.DragDropService.PreviewDragOver += OnPreviewDragOver;
    lvUserPreference.ListViewElement.DragDropService.PreviewDragDrop -= OnPreviewDragDrop;
    lvUserPreference.ListViewElement.DragDropService.PreviewDragDrop += OnPreviewDragDrop;
    lvUserPreference.VisualItemFormatting += OnVisualItemFormatting;
    // Item formatting event
    private void OnVisualItemFormatting(object sender, ListViewVisualItemEventArgs e)
        e.VisualItem.ToggleElement.Margin = new Padding(10);
        e.VisualItem.BackColor = ComponentSettings.DefaultBorderColor;
        e.VisualItem.GradientStyle = GradientStyles.Solid;
        e.VisualItem.Margin = new Padding(0);
        e.VisualItem.MinSize = new Size(200, 30);
        e.VisualItem.Font = ComponentSettings.DefaultFont;
        var itemAttrId = (int)e.VisualItem.Data.Value;
        var field = _fields.FirstOrDefault(x => x.AttrId == itemAttrId);
        if (field != null && (field.IsTreeField || field.IsRequired))
            e.VisualItem.ToggleElement.Enabled = false;
            e.VisualItem.ToggleElement.Enabled = true;




  2. Answer
    Dimitar avatar
    2841 posts

    Posted 17 May 2017 Link to this post

    Hello Paul,

    Remove the MinSize from the formatting event. You can set the item size like this:
    lvUserPreference.ItemSize = new Size(200, 30);

    In addition, I want to say that the grid supports this out of the box. Detailed information is available here: Column Chooser | RadGridView.

    I hope this will be useful. Let me know if you have additional questions.

    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Paul
    Paul avatar
    34 posts
    Member since:
    Apr 2017

    Posted 17 May 2017 in reply to Dimitar Link to this post

    Hello Dimitar,

    Thanks you for your help, it working well for me.

    I will take a look at the feature: grid supports this out of the box



Back to Top