flash or blinking row

12 posts, 1 answers
  1. Rocio
    Rocio avatar
    16 posts
    Member since:
    Sep 2012

    Posted 20 Sep 2012 Link to this post

    Hello, I am newbie with telerik controls, and I am doing a app with a GridView, I would like to make some rows blink or flash, but I can't find anything about it, Is there an easy way?
    Hope somebody can help me.
    Thanks!
  2. Pavel Pavlov
    Admin
    Pavel Pavlov avatar
    2039 posts

    Posted 20 Sep 2012 Link to this post

    Hi Rocio,

    I guess you need to make the row blink based on a certain value within .

    In general the recommended approach would be to set a style for the row using a RowStyleSelector.
    Within the style targeting GridViewRow I believe you may set an animation to toggle the background color thus the blinking effect.

    Regards,
    Pavel Pavlov
    the Telerik team

    Time to cast your vote for Telerik! Tell DevPro Connections and Windows IT Pro why Telerik is your choice. Telerik is nominated in a total of 25 categories.

  3. UI for WPF is Visual Studio 2017 Ready
  4. Rocio
    Rocio avatar
    16 posts
    Member since:
    Sep 2012

    Posted 20 Sep 2012 Link to this post

    Hello Pavel, thanks for you quick response, I used the RowStyleSelector for my background color, but when I applied it the scroll or the "next Page" navigation didn't work, so I decided to change the background color on the RowLoaded event with:
    e.Row.Background = new SolidColorBrush(Colors.Blue);

    I was thinking in something like that for the blinking, but I can try your recomendation, could you be more specific? because I haven't worked with style selectors, and any little example would be great
    Thanks a lot!
  5. Pavel Pavlov
    Admin
    Pavel Pavlov avatar
    2039 posts

    Posted 20 Sep 2012 Link to this post

    Hi,

    When you apply the following style to a row, it will  start blinking:
    <Style TargetType="telerik:GridViewRow" >
              <Style.Setters>
                  <Setter Property="Background" Value="Red" />
              </Style.Setters>
              <Style.Triggers>
                  <Trigger Property="Visibility" Value="Visible">
                      <Trigger.EnterActions>
                          <BeginStoryboard>
                              <Storyboard >
                                  <ColorAnimation Storyboard.TargetProperty="Background.Color"
                                                  Duration="0:0:0.2"  From="White" To="Red" RepeatBehavior="Forever" AutoReverse="True"/>
                              </Storyboard>
                          </BeginStoryboard>
                      </Trigger.EnterActions>
                  </Trigger>
              </Style.Triggers>
          </Style>


    Kind regards,
    Pavel Pavlov
    the Telerik team

    Time to cast your vote for Telerik! Tell DevPro Connections and Windows IT Pro why Telerik is your choice. Telerik is nominated in a total of 25 categories.

  6. Rocio
    Rocio avatar
    16 posts
    Member since:
    Sep 2012

    Posted 20 Sep 2012 Link to this post

    Hello Pavel, thanks for your response, I have consulted telerik examples about how to add this style to my grid, and I am a bit confused, I have to create a <Grid.Resources> section, and put  the style in there:

    <Grid.Resources>
    <Style Key="BlinkStyle" TargetType="telerik:GridViewRow" >
              <Style.Setters>
                  <Setter Property="Background" Value="Red" />
              </Style.Setters>
              <Style.Triggers>
                  <Trigger Property="Visibility" Value="Visible">
                      <Trigger.EnterActions>
                          <BeginStoryboard>
                              <Storyboard >
                                  <ColorAnimation Storyboard.TargetProperty="Background.Color"
                                                  Duration="0:0:0.2"  From="White" To="Red" RepeatBehavior="Forever" AutoReverse="True"/>
                              </Storyboard>
                          </BeginStoryboard>
                      </Trigger.EnterActions>
                  </Trigger>
              </Style.Triggers>
          </Style>
    </Grid.Resources>

    But I am not sure about how to apply it to some columns, the examples uses Conditional style selectors, in my case I only need one rule, because I only have one style to apply, but I don't know what the first line refers to, and in my case what to use as ConditionConverter, and how to "say" to it wich rows have to be blinking

    <Examples:UnitPriceConveter x:Key="converter" />
              <Examples:ConditionalStyleSelector x:Key="selector" ConditionConverter="{StaticResource converter}">
                    <Examples:ConditionalStyleSelector.Rules>
                        <Examples:ConditionalStyleRule Style="{StaticResource BlinkStyle}">
                            <Examples:ConditionalStyleRule.Value>
                                <sys:Boolean>True</sys:Boolean>
                            </Examples:ConditionalStyleRule.Value>
                        </Examples:ConditionalStyleRule>                   
                    </Examples:ConditionalStyleSelector.Rules>
                </Examples:ConditionalStyleSelector>

    Thanks again
  7. Pavel Pavlov
    Admin
    Pavel Pavlov avatar
    2039 posts

    Posted 20 Sep 2012 Link to this post

    Hi,

    You said you need the row blinking, but then you need it just for some columns. Do you need just a cell blinking ?

    Also what is the condition that relates to the cell /row blinking ?  Once we clear these , I will gather a small runnable project for you .

    Greetings,
    Pavel Pavlov
    the Telerik team

    Time to cast your vote for Telerik! Tell DevPro Connections and Windows IT Pro why Telerik is your choice. Telerik is nominated in a total of 25 categories.

  8. Rocio
    Rocio avatar
    16 posts
    Member since:
    Sep 2012

    Posted 20 Sep 2012 Link to this post

    Hello Pavel, I think I haven't explained myself properly, I'm sorry.
    I have a grid with some columns, and depending on the value of the first column is how I decide if the entire row should blink or not.

    I have read your example of Style Selectors, and I get that I have to create a class that inherits from StyleSelector, is it right? and in that class I have to override the SelectStyle method, depending on the item I have to return an style or the other, but I don't know how to create the style with the trigger and the animation programmatically like with the background color.
    Thanks!
  9. Answer
    Pavel Pavlov
    Admin
    Pavel Pavlov avatar
    2039 posts

    Posted 25 Sep 2012 Link to this post

    Hi,

    I am attaching a small example where the row will blink for all items with price < 100.

    Hope this helps.

    All the best,
    Pavel Pavlov
    the Telerik team

    Time to cast your vote for Telerik! Tell DevPro Connections and Windows IT Pro why Telerik is your choice. Telerik is nominated in a total of 25 categories.

  10. Rocio
    Rocio avatar
    16 posts
    Member since:
    Sep 2012

    Posted 04 Oct 2012 Link to this post

    Hello Pavel, and thanks for your response, I finally proved it and it totally worked for me.
    Thanks again!
  11. INS software
    INS software avatar
    2 posts
    Member since:
    Aug 2015

    Posted 24 Aug 2015 in reply to Pavel Pavlov Link to this post

    Good Answer.

    Good job~.

  12. INS software
    INS software avatar
    2 posts
    Member since:
    Aug 2015

    Posted 06 Sep 2015 in reply to Pavel Pavlov Link to this post

    Good answer and sample~.

    I have a question. How can I change color in From/To of stroryboard of your sample?

  13. Maya
    Admin
    Maya avatar
    4062 posts

    Posted 07 Sep 2015 Link to this post

    Hello,

    Do you want to change them runtime based on some condition or just change the value of white/red ? 

    Regards,
    Maya
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top
UI for WPF is Visual Studio 2017 Ready