This is a migrated thread and some comments may be shown as answers.

Inside a RadGridView how do I overlay the value on the RadProgressBar control?

6 Answers 250 Views
GridView
This is a migrated thread and some comments may be shown as answers.
R
Top achievements
Rank 1
R asked on 30 Jul 2014, 05:26 PM
Hi, inside a RadGridView how do I overlay the value on a RadProgressBar control?

So the PercentFilled value below, say 75, will be displayed at 75% on top of the progressbar.

What I have but I can't get it to work:

            <telerik:RadGridView.Columns >
                    <telerik:GridViewDataColumn.CellTemplate>
                        <DataTemplate>
                            <telerik:RadProgressBar Minimum="0" Maximum="100" Value="{Binding PercentFilled}"/>
                        </DataTemplate>
                    </telerik:GridViewDataColumn.CellTemplate>
                </telerik:GridViewDataColumn>
            </telerik:RadGridView.Columns>

Thanks

6 Answers, 1 is accepted

Sort by
0
Yoan
Telerik team
answered on 04 Aug 2014, 07:58 AM
Hi Russell,

Indeed this is the correct approach. However, you have missed the following line:
<telerik:RadGridView.Columns>
             <telerik:GridViewDataColumn>
                 <telerik:GridViewDataColumn.CellTemplate>
                     <DataTemplate>
                         <telerik:RadProgressBar Minimum="0" Maximum="100" Value="{Binding Percent}"/>
                     </DataTemplate>
                 </telerik:GridViewDataColumn.CellTemplate>
             </telerik:GridViewDataColumn>
         </telerik:RadGridView.Columns>

For your convenience, I have attached a sample project which demonstrates the approach. I hope it helps.

Regards,
Yoan
Telerik
 
Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
 
0
R
Top achievements
Rank 1
answered on 05 Aug 2014, 01:25 PM
Hi, I don't think you understood the question. I can get the progress bar to work - just like your example code but I would like to overlay a text value, '99%', on top of the progress bar.

Can you help with this?
0
Yoan
Telerik team
answered on 05 Aug 2014, 01:39 PM
Hello Russell,

Indeed, I can not fully understand your question. May I ask you to clarify where you want to show the value. It would be great if can provide a simple image illustrating your scenario.

Thank you in advance.

Regards,
Yoan
Telerik
 
Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
 
0
R
Top achievements
Rank 1
answered on 05 Aug 2014, 01:45 PM
Hi, thanks for the quick reply.

Basically I want to string format the Value field to appear on top of the progress bar. So using the example below right now it shows the progress bar as 75% complete with no text just a plain progress bar. I want to put the text "75%" on top the bar so the bar remains as-is but with some text overlaid on top to say "75% (so string.format("{0} %", Value);).

  <telerik:RadProgressBar Minimum="0" Maximum="100" Value="75"/>


I hope this is clear now?

thanks
0
Accepted
Pavel R. Pavlov
Telerik team
answered on 06 Aug 2014, 07:10 AM
Hello,

In order to achieve your requirement you can wrap the RadProgressBar in a Grid control and use a TextBlock to visualize the RadProgressBar.Value. Basically, instead of using just the control you can use this definition.

<Grid>
    <telerik:RadProgressBar x:Name="progress"/>
    <TextBlock FontWeight="Bold" Foreground="Red" Grid.Column="1" HorizontalAlignment="Center" VerticalAlignment="Center">
        <Run Text="{Binding ElementName=progress, Path=Value, StringFormat=n2}"/>
        <Run Text="%"/>
    </TextBlock>
</Grid>
If this approach is not convenient for you, please let us know and I will suggest another approach.

Regards,
Pavel R. Pavlov
Telerik
 
Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
 
0
R
Top achievements
Rank 1
answered on 06 Aug 2014, 10:34 AM
Thanks a lot.
Tags
GridView
Asked by
R
Top achievements
Rank 1
Answers by
Yoan
Telerik team
R
Top achievements
Rank 1
Pavel R. Pavlov
Telerik team
Share this question
or