CheckBoxColumn change style..

7 posts, 0 answers
  1. Sean
    Sean avatar
    14 posts
    Member since:
    Aug 2011

    Posted 07 Sep 2011 Link to this post

    Hello is there any way to make the checkbox appear darker, bold in side the gridview? I am not sure the property to edit.

    <Style x:Key="CheckBoxColumn" TargetType="{x:Type telerik:GridViewCell}">
                   <Setter Property="FontWeight" Value="Bold"/>
               </Style>
     
     
     
    <telerik:GridViewCheckBoxColumn EditorStyle="{StaticResource CheckBoxColumn}"  Header="Eligibility" IsReadOnly="True" DataMemberBinding="{Binding Verified}">
                                       <telerik:GridViewCheckBoxColumn.CellStyle>
                                           <Style TargetType="telerik:GridViewCell">
                                               <Setter Property="Background" Value="{Binding VerificationStatus, Converter={StaticResource MyConverter2}}" />
                                           </Style>
                                       </telerik:GridViewCheckBoxColumn.CellStyle>
                                   </telerik:GridViewCheckBoxColumn>
                                   

    The above code did not do it.

    Thanks,
    S
  2. Vanya Pavlova
    Admin
    Vanya Pavlova avatar
    2019 posts

    Posted 08 Sep 2011 Link to this post

    Hello Sean,

     

    The standard GridViewCheckBoxColumn uses a GridViewCheckBox and the standard CheckBox control as its editor. If you want to bold the content of a CheckBox you may predefine the CellTemplate for a standard column and manually set the FontWeight of the CheckBox:


    <telerik:RadGridView  Margin="40,40,168,90" AutoGenerateColumns="False" ItemsSource="{Binding Collection}">
                <telerik:RadGridView.Columns>
                    <telerik:GridViewDataColumn DataMemberBinding="{Binding Property2}">
                        <telerik:GridViewDataColumn.CellTemplate>
                            <DataTemplate>
                                <CheckBox  telerik:StyleManager.Theme="Office_Black" FontWeight="Bold" Content="{Binding Property2}" IsChecked="{Binding Property2}"/>
                                </DataTemplate>
                            </telerik:GridViewDataColumn.CellTemplate>
                             
                        </telerik:GridViewDataColumn>
                    </telerik:RadGridView.Columns>
                </telerik:RadGridView>


    As an alternative you may also define a style targeted at a GridViewCell and manipulate its appearance from there:


    <Window.Resources>
        <Style x:Key="ss" TargetType="telerik:GridViewCell">
            <Setter Property="Background" Value="Red"/>
            <Setter Property="FontWeight" Value="Bold"/>
            </Style>
        </Window.Resources>
        <Grid x:Name="LayoutRoot" DataContext="{Binding Source={StaticResource SampleDataSource}}">
            <telerik:RadGridView  Margin="40,40,168,90" AutoGenerateColumns="False" ItemsSource="{Binding Collection}">
                <telerik:RadGridView.Columns>
                    <telerik:GridViewDataColumn CellStyle="{StaticResource ss}" DataMemberBinding="{Binding Property2}">
                        <telerik:GridViewDataColumn.CellTemplate>
                            <DataTemplate>
                                <CheckBox  telerik:StyleManager.Theme="Office_Black" Content="{Binding Property2}" IsChecked="{Binding Property2}"/>
                                </DataTemplate>
                            </telerik:GridViewDataColumn.CellTemplate>
                             
                        </telerik:GridViewDataColumn>
                    </telerik:RadGridView.Columns>
                </telerik:RadGridView>
        </Grid>
    </Window>


    Furthermore the recommended approach to a apply a style based on underlying property value is through StyleSelectors, please check our online demos for further reference. 



    Kind regards,
    Vanya Pavlova
    the Telerik team

    Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>

  3. Sean
    Sean avatar
    14 posts
    Member since:
    Aug 2011

    Posted 08 Sep 2011 Link to this post

    I did something like this originally but it was impossible to prevent the user from clicking the contents of the checkbox in the column. Is that possible to do? When I did something similar to this they were able to check the checkbox still:

    <telerik:GridViewDataColumn Header="Confirmed" IsReadOnly="True">
                                     <telerik:GridViewDataColumn.CellTemplate>
                                         <DataTemplate>
                                             <CheckBox telerik:StyleManager.Theme="Office_Black" FontWeight="Bold" Content="{Binding ConfirmedStatus}" IsChecked="{Binding ConfirmedStatus}"/>
                                         </DataTemplate>
                                 </telerik:GridViewDataColumn.CellTemplate>
                                     <telerik:GridViewDataColumn.CellStyle>
                                         <Style TargetType="telerik:GridViewCell">
                                             <Setter Property="Background" Value="{Binding ConfirmedStatus, Converter={StaticResource ConStatConverter}}" />
                                         </Style>
                                     </telerik:GridViewDataColumn.CellStyle>
                                 </telerik:GridViewDataColumn>
  4. Vanya Pavlova
    Admin
    Vanya Pavlova avatar
    2019 posts

    Posted 09 Sep 2011 Link to this post

    Hi Sean,

     

    You may use a GridViewCheckBoxColumn instead that will listen for the IsReadOnlyBinding property and will become non-editable if it is set to "True":


    <telerik:GridViewCheckBoxColumn DataMemberBinding="{Binding Property2}" IsReadOnlyBinding="{Binding Property2}"/>
     



    Best wishes,
    Vanya Pavlova
    the Telerik team

    Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>

  5. Sean
    Sean avatar
    14 posts
    Member since:
    Aug 2011

    Posted 09 Sep 2011 Link to this post

    I tried that but the checkbox still appears "grayed-out". Is there a way around this?

    Thanks,

    Sean
  6. Vanya Pavlova
    Admin
    Vanya Pavlova avatar
    2019 posts

    Posted 09 Sep 2011 Link to this post

    Hello Sean,

     

    GridViewCheckBox is gray-colored by design when the cell is not in Edit mode. You may change this through edit the template of a GridViewCheckBox and predefine the brushes which are used by default.
    In this way you may configure it to meet up your personal requirements.



    All the best,
    Vanya Pavlova
    the Telerik team

    Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>

  7. Alwin
    Alwin avatar
    1 posts
    Member since:
    Dec 2016

    Posted 14 Dec 2016 in reply to Vanya Pavlova Link to this post

    Hi Vanya,

    I have this GridViewCheckBox column type and I want to collapse just the Checkbox control for some of the rows, based on some derived from other columns in grid.

    Now, I used the CellStyleSelector of GridViewCheckBoxColumn, for my Style selector  that I created I am not able to set the TargetType as GridViewCheckBox, it fails saying the type does not match with type of element 'GridViewCell'.

    I assume that CellStyleSelector will apply only to GridViewCell, what style selector should I use to apply to the GridViewCheckBox only?

    Please see the attachment for implemented code and error.

     

     

Back to Top