Listview Icon View Problem

3 posts, 1 answers
  1. Mark
    Mark avatar
    6 posts
    Member since:
    Nov 2018

    Posted 22 Mar 2019 Link to this post

    Hi,

    I have been trying to make the icon view more of a tile view however when I try and do the back colour it does a gradient fill instead. See attachment

    Form Code

        this.radListView2.ViewType = ListViewType.IconsView;
        this.radListView2.ItemSize = new Size(300, 120);
        this.radListView2.ItemSpacing = 10;
        this.radListView2.AllowEdit = false;
        this.radListView2.EnableFiltering = true;
        this.radListView2.HotTracking = false;
     
        this.radListView2.RootElement.BackColor = Color.Transparent;
        this.radListView2.BackColor = Color.Transparent;
        this.radListView2.ListViewElement.DrawFill = false;
        this.radListView2.ListViewElement.ViewElement.BackColor = Color.Transparent;
     
        this.radListView2.RootElement.EnableElementShadow = false;
    }
     
    private void radListView2_VisualItemCreating(object sender, ListViewVisualItemCreatingEventArgs e)
    {
        if (e.VisualItem is IconListViewVisualItem)
        {
            e.VisualItem = new PeopleListIcon();
        }
    }

     

    PeopleListIcon Code

    using System;
    using HRSystem.HRDataCentre;
    using System.Collections.Generic;
    using System.Drawing;
    using System.Reflection;
    using System.Text;
    using Telerik.WinControls;
    using Telerik.WinControls.UI;
    using System.Linq;
    using Telerik.WinControls.Layouts;
     
    namespace HRSystem.New_Element
    {
        public class PeopleListIcon : IconListViewVisualItem
        {
            protected override Type ThemeEffectiveType
            {
                get
                {
                    return typeof(IconListViewVisualItem);
                }
            }
     
            LightVisualElement RoleName = new LightVisualElement();
            LightVisualElement RoleType = new LightVisualElement();
     
            LightVisualElement PersonName = new LightVisualElement();
     
            LightVisualElement Duration = new LightVisualElement();
            LightVisualElement Active = new LightVisualElement();
     
            private StackLayoutElement verticalContainer = new StackLayoutElement();
            private StackLayoutElement roomHeaderContainer = new StackLayoutElement();
            private StackLayoutElement roomFooterContainer = new StackLayoutElement();
     
            protected override void CreateChildElements()
            {
                base.CreateChildElements();
     
                verticalContainer.Orientation = System.Windows.Forms.Orientation.Vertical;
                verticalContainer.NotifyParentOnMouseInput = true;
                verticalContainer.ShouldHandleMouseInput = false;
                verticalContainer.StretchHorizontally = true;
                verticalContainer.StretchVertically = true;
     
                roomHeaderContainer.Orientation = System.Windows.Forms.Orientation.Horizontal;
                roomHeaderContainer.NotifyParentOnMouseInput = true;
                roomHeaderContainer.ShouldHandleMouseInput = false;
                roomHeaderContainer.Children.Add(RoleName);
                roomHeaderContainer.Children.Add(RoleType);
                roomHeaderContainer.StretchHorizontally = true;
     
                RoleName.NotifyParentOnMouseInput = true;
                RoleName.ShouldHandleMouseInput = false;
                RoleName.StretchHorizontally = true;
                RoleName.CustomFont = "Roboto";
                RoleName.CustomFontSize = 9;
                RoleName.CustomFontStyle = FontStyle.Bold;
                RoleName.Margin = new System.Windows.Forms.Padding(5, 10, 0, 0);
                RoleName.TextAlignment = System.Drawing.ContentAlignment.MiddleLeft;
     
                RoleType.NotifyParentOnMouseInput = true;
                RoleType.ShouldHandleMouseInput = false;
                RoleType.StretchHorizontally = false;
                RoleType.CustomFont = "Roboto";
                RoleType.CustomFontSize = 9;
                RoleType.CustomFontStyle = FontStyle.Regular;
                RoleType.Margin = new System.Windows.Forms.Padding(0, 5, 5, 0);
     
                roomFooterContainer.Orientation = System.Windows.Forms.Orientation.Horizontal;
                roomFooterContainer.NotifyParentOnMouseInput = true;
                roomFooterContainer.ShouldHandleMouseInput = false;
                roomFooterContainer.StretchHorizontally = true;
                roomFooterContainer.DrawFill = true;
                roomFooterContainer.BackColor = Color.White;
                roomFooterContainer.GradientStyle = GradientStyles.Solid;
                roomFooterContainer.MinSize = new System.Drawing.Size(0, 30);
     
                PersonName.TextImageRelation = System.Windows.Forms.TextImageRelation.ImageBeforeText;
                PersonName.StretchHorizontally = false;
                PersonName.Layout.LeftPart.Padding = new System.Windows.Forms.Padding(24, 0, 8, 0);
     
                PersonName.Alignment = System.Drawing.ContentAlignment.MiddleCenter;
                PersonName.NotifyParentOnMouseInput = true;
                PersonName.ShouldHandleMouseInput = false;
                PersonName.CustomFont = "Roboto";
                PersonName.CustomFontSize = 12;
                PersonName.CustomFontStyle = FontStyle.Regular;
     
                 
                Duration.NotifyParentOnMouseInput = true;
                Duration.ShouldHandleMouseInput = false;
     
                Duration.StretchVertically = true;
                Active.StretchVertically = true;
                roomFooterContainer.Children.Add(Duration);
                roomFooterContainer.Children.Add(Active);
     
                Active.NotifyParentOnMouseInput = true;
                Active.ShouldHandleMouseInput = false;
                Active.StretchHorizontally = false;
                Active.TextImageRelation = System.Windows.Forms.TextImageRelation.ImageBeforeText;
                Active.CustomFont = "Roboto";
                Active.CustomFontSize = 9;
                Active.CustomFontStyle = FontStyle.Regular;
     
                Duration.TextImageRelation = System.Windows.Forms.TextImageRelation.ImageBeforeText;
                Duration.CustomFont = "Roboto";
                Duration.CustomFontSize = 9;
                Duration.CustomFontStyle = FontStyle.Regular;
                Duration.Margin = new System.Windows.Forms.Padding(5, 0, 0, 0);
                Duration.StretchHorizontally = false;
     
                verticalContainer.Children.Add(roomHeaderContainer);
                verticalContainer.Children.Add(PersonName);
                verticalContainer.Children.Add(roomFooterContainer);
     
                this.Children.Add(this.verticalContainer);
            }
            protected override void SynchronizeProperties()
            {
                base.SynchronizeProperties();
                this.DrawText = false;
                this.BackColor = Color.White;
                this.DrawFill = true;
                this.DrawBorder = false;
                RoleName.Margin = new System.Windows.Forms.Padding(8, 8, 0, 0);
                RoleType.ImageLayout = System.Windows.Forms.ImageLayout.None;
                PersonName.Margin = new System.Windows.Forms.Padding(24, 0, 0, 0);
     
                PersonName.Layout.LeftPart.Margin = new System.Windows.Forms.Padding(0, 0, 5, 0);
                PersonName.StretchHorizontally = true;
                PersonName.ImageAlignment = ContentAlignment.MiddleLeft;
                PersonName.TextAlignment = ContentAlignment.MiddleLeft;
     
                Duration.Layout.LeftPart.Margin = new System.Windows.Forms.Padding(0, -3, 0, 0);
                Duration.ForeColor = Color.FromArgb(200, 0, 0, 0);
                Active.ForeColor = Color.FromArgb(200, 0, 0, 0);
                Active.Layout.LeftPart.Margin = new System.Windows.Forms.Padding(0, -3, 0, 0);
     
                People Person = this.Data.DataBoundItem as People;
     
                if (Person != null)
                {
                    RoleName.Text = Person.Roles.Any() ? Person.Roles.FirstOrDefault().RoleTitle : "No Role";
                    RoleType.Text = Person.Roles.Any() ? Person.Roles.FirstOrDefault().Type.Description : "";
     
                    PersonName.Text = Person.Forename + " " + Person.Surname;
                    int age = Person.Roles.Any() ? Function.GetAge(Person.Roles.FirstOrDefault().StartDate) : 0;
                    Duration.Text = age + " years";
     
                    RoleName.ForeColor = Color.FromArgb(190, 0, 0, 0);
                    RoleType.ForeColor = Color.Black;
                    PersonName.ForeColor = Color.Black;
     
                    if (RoleType.Text == "Staff" || RoleType.Text == "Volunteer")
                    {
                        this.BackColor = Color.FromArgb(247, 247, 247);
                    }
                    else
                    {
                        this.BackColor = Color.FromArgb(170, 13, 13);
                    }
                }
                else
                {
                    PersonName.Text = "Free Room";
                    Duration.Text = "0 days";
                    this.BackColor = Color.DarkRed;
                    RoleName.ForeColor = Color.White;
                    RoleType.ForeColor = Color.White;
                    PersonName.ForeColor = Color.White;
                }
            }
        }
    }
  2. Answer
    Dimitar
    Admin
    Dimitar avatar
    2858 posts

    Posted 22 Mar 2019 Link to this post

    Hello Mark,

    You can add the following setting to the SynchronizeProperties method:
    this.GradientStyle = GradientStyles.Solid;

    I hope this helps. Should you have any other questions do not hesitate to ask.
     
    Regards,
    Dimitar
    Progress Telerik
    Get quickly onboard and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  3. Mark
    Mark avatar
    6 posts
    Member since:
    Nov 2018

    Posted 22 Mar 2019 in reply to Dimitar Link to this post

    That worked, thank you!
Back to Top