RadGridView with colorpicker?

5 posts, 0 answers
  1. sivakanth
    sivakanth avatar
    50 posts
    Member since:
    Dec 2010

    Posted 21 Feb 2011 Link to this post

    Hello Telerik Team,
                                       I have a doupt in radcolorpicker with radgridview.
    We are fan of telerik controls.
             In my last project our master page contains 5 fields including radcolorpicker.our aim is the row details are shown in radgridview with diffrent color.The color value is user gives when adding each  entries.

         Here i am binding in XAML below:-
    <Label Content="Color" Height="24"  Margin="5,8,191,0" Name="label24" FontSize="11" Grid.Column="1" Grid.Row="3" VerticalAlignment="Top" />
    <telerik:RadColorPicker SelectedColor="{Binding Path=Colour,Mode=TwoWay, UpdateSourceTrigger=LostFocus, NotifyOnValidationError=True, ValidatesOnDataErrors=True, ValidatesOnExceptions=True}" Height="24" Margin="124,8,0,0" Name="rclrColour" TabIndex="24" FontSize="11" Grid.Column="1" Grid.Row="3" Width="39" />
    The color value is stored in database as hexadecimal value.

    i am using RowLoaded event for display color details.
    private void rgrdCompanyViewAll_RowLoaded(object sender, Telerik.Windows.Controls.GridView.RowLoadedEventArgs e)
            {
                var row = e.Row as GridViewRow;
                if (row != null)
                {
                        var cell = ((CompanyBO)e.Row.Item).Colour;
                        if (cell != null)
                        {
                            var value = cell;
                            e.Row.Background = new SolidColorBrush((Color)ColorConverter.ConvertFromString(value.ToString()));
                        }
                }
            }

    Here is my QUESTION:-
    Every thing is fine.But the colors display in radgridview are changed each and every minute when i am using scroll bar(vertical).

    i make mistake at anywhere?

    Pls suggest me?

  2. Tina Stancheva
    Admin
    Tina Stancheva avatar
    3298 posts

    Posted 23 Feb 2011 Link to this post

    Hi sivakanth,

    I am not sure if I understand your issue correctly. Can you please elaborate on how the RadColorPicker controls the Row's Background color?

    Also, if you can modify the attached project to reproduce the issue, we will be able to further investigate it. Thank you in advance.

    All the best,
    Tina Stancheva
    the Telerik team
    Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!
  3. UI for WPF is Visual Studio 2017 Ready
  4. sivakanth
    sivakanth avatar
    50 posts
    Member since:
    Dec 2010

    Posted 24 Feb 2011 Link to this post

    Hello Telerik Team,
                                   Still i didn't get correct solution for this issue.I will explain You in detail.

    I have a single Customer Entry form.Its contains 3 fields.Names are CompanyID,CompanyName,Color.
    and only one Add button.Whenever customer give the 3 values then enter Add Button.That time the values are stored in database.
    in the entry form i have one radgrid Also.The radGridview display all the datas from database.here i want to set background color in each and every row.The color value user given when adding entries. so my result is retrive all datas from database then display radGridView with diffrent color in every row. 

    Here i am using RowLoaded event and apply background setting.
    But it display wrong color.when i add more than 20 entries i got this problem.Particularly i am using scroll bar(vertical) to up and down.

    I will attach the smple below .Give me correct solution.  
    This is my MainWindow Xaml code:
      
    <Window x:Class="ColorPickerSample.MainWindow"
            Title="MainWindow" Height="563" Width="850">
        <Grid>
            <GroupBox Header="Company Details" Height="103" Margin="12,6,12,0" Name="groupBox1" VerticalAlignment="Top" FontSize="14">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition />
                        <ColumnDefinition />
                        <ColumnDefinition />
                    </Grid.ColumnDefinitions>
                    <Label Content="Company ID" Height="24" Margin="8,7,0,0" Name="label1" FontSize="11" VerticalAlignment="Top" HorizontalAlignment="Left" Width="88" />
                    <Label Background="#FFFFFFCC" Content="{Binding CompanyID,Mode=TwoWay}" Height="24" Margin="118,7,64,0" Name="lblCompanyID" FontSize="11" VerticalAlignment="Top" />
                    <Label Content="Company Name" Height="24" Margin="5,7,0,0" Name="label2" FontSize="11" Grid.Column="1" VerticalAlignment="Top" HorizontalAlignment="Left" Width="110" />
                    <TextBox Margin="125,7,8,0" Text="{Binding Path=CompanyName}" Height="24" MaxLength="200" Name="txtCompanyName" TabIndex="1" FontSize="11" Grid.Column="1" VerticalAlignment="Top" />
                    <Label Content="Color" Height="24"  Margin="29,8,167,0" Name="label24" FontSize="11" Grid.Column="2" VerticalAlignment="Top" />
                    <telerik:RadColorPicker SelectedColor="{Binding Path=Colour,Mode=TwoWay, UpdateSourceTrigger=LostFocus, NotifyOnValidationError=True, ValidatesOnDataErrors=True, ValidatesOnExceptions=True}" Height="24" Margin="210,8,0,0" Name="rclrColour" TabIndex="24" FontSize="11" Grid.Column="2" Width="39" />
                </Grid>
            </GroupBox>
            <telerik:RadGridView IsReadOnly="True" AutoGenerateColumns="False" CanUserFreezeColumns="False"  CanUserSortColumns="False" Margin="206,144,343,231" Name="rgrdCompanyViewAll" ShowGroupPanel="False" RowLoaded="rgrdCompanyViewAll_RowLoaded" TabIndex="25">
                <telerik:RadGridView.Columns>
                    <telerik:GridViewDataColumn DataMemberBinding="{Binding Path=CompanyID}" Header="Company ID" Width="100" />
                    <telerik:GridViewDataColumn DataMemberBinding="{Binding Path=CompanyName}" Header="Company Name" Width="150" />
                    <telerik:GridViewDataColumn DataMemberBinding="{Binding Path=Colour}" Header="Colour" Width="120"/>
            </telerik:RadGridView.Columns>
            </telerik:RadGridView>
            <Button Content="Save" Height="23" HorizontalAlignment="Left" Margin="338,115,0,0" Name="button1" VerticalAlignment="Top" Width="75" Click="button1_Click" />
        </Grid>
    </Window>
    My BO is:
      
    class CompanyBO
        {
            private int? _companyID;
            private string _companyName;
            private string _colour;
              
      
            public int? CompanyID
            {
                get { return _companyID; }
                set { _companyID = value; }
            }
            public string CompanyName
            {
                get { return _companyName; }
                set { _companyName = value; }
            }
            public string Colour
            {
                get { return _colour; }
                set { _colour = value; }
            }
              
        }
    My DAL is:
      
    class CompanyDAL
        {
            Meenakshi_PawnEntities db;
            public CompanyDAL()
            {
                db = new Meenakshi_PawnEntities();
            }
      
            public void Insert(CompanyBO companyEntity)
            {
                    Company tableEntity = new Company();
                    tableEntity.CompanyName = companyEntity.CompanyName;
                    tableEntity.Colour = companyEntity.Colour;
                    db.AddToCompanies(tableEntity);
                    db.SaveChanges();
                 
                  
            }
              
      
              
            public IQueryable<CompanyBO> FetchAll()
            {
                var companyBOCollection = from c in db.Companies
                                              select new CompanyBO
                                              {
                                                  CompanyID = c.CompanyID,
                                                  CompanyName = c.CompanyName,
                                                  Colour=c.Colour
                                              };
                    return companyBOCollection;
               
             }
             
        }
    My MainWindow.Xaml.cs is:
      
     public partial class MainWindow : Window
        {
            public MainWindow()
            {
                InitializeComponent();
                CompanyBO companyEntity = new CompanyBO();
                this.DataContext = companyEntity;
                this.txtCompanyName.Focus();
                this.Load();
                  
            }
      
            private void button1_Click(object sender, RoutedEventArgs e)
            {
                CompanyDAL companyDataEntity = new CompanyDAL();
                companyDataEntity.Insert(this.DataContext as CompanyBO);
                this.Load();
                MessageBox.Show("Company details are added successfully");
                Refresh();
            }
      
            public void Load()
            {
                CompanyDAL companyDataEntity = new CompanyDAL();
                this.rgrdCompanyViewAll.ItemsSource = companyDataEntity.FetchAll();
            }
      
            public void Refresh()
            {
                CompanyBO companyEntity = new CompanyBO();
                this.DataContext = companyEntity;
            }
            private void rgrdCompanyViewAll_RowLoaded(object sender, Telerik.Windows.Controls.GridView.RowLoadedEventArgs e)
            {
                var row = e.Row as GridViewRow;
                if (row != null)
                {
                    var cell = ((CompanyBO)e.Row.Item).Colour;
                    if (cell != null)
                    {
                        var value = cell;
                        e.Row.Background = new SolidColorBrush((Color)ColorConverter.ConvertFromString(value.ToString()));
                    }
                }
            }
        }
    I want to display GridView Row colors based on database values.Not overlap other colors when i am using Scrolling(Vertical).
  5. Pavel Pavlov
    Admin
    Pavel Pavlov avatar
    2039 posts

    Posted 01 Mar 2011 Link to this post

    Hi sivakanth,

    I think I found the problem.  Can you please try binding the background color, instead of setting it.

    It should be something like :
    private void rgrdCompanyViewAll_RowLoaded(object sender, Telerik.Windows.Controls.GridView.RowLoadedEventArgs e)
            {
                var row = e.Row as GridViewRow;
                if (row != null)
                {
                    var cell = ((CompanyBO)e.Row.Item).Colour;
                    if (cell != null)
                    {
                        var value = cell; 

                        e.Row.SetBinding(GridViewRow.BackgroundProperty,new Binding("Colour"){ Converter = .....};
                    }
                }
            }
    * Do not set the source for the binding , just leave it to take the value form its DataContext( the item) .

    In case you find troubles implementing this, just let me know and I will give you a small sample.

    All the best,
    Pavel Pavlov
    the Telerik team
    Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!
  6. sivakanth
    sivakanth avatar
    50 posts
    Member since:
    Dec 2010

    Posted 01 Mar 2011 Link to this post

    Hello Pavel Pavlov

            Thank you for your nice reply.
    But i didn't Understand?
    Could u please post sample solution?
Back to Top
UI for WPF is Visual Studio 2017 Ready