Change icon of RadWindow.Alert(new DialogParameters());

[Sumati]

Change icon of RadWindow.Alert(new DialogParameters());

When message box is displayed, I get a icon of triangle shape, yellow color with exclamation mark in it
Can I change to a  green cirlcle with correction symbol in it?

[Sumati]

I am able to fix this issue with help of my colleague

1) In Expression blend, edit template for 'RadAlert'
2) The template code will be generated
3) Notice the <Image> tag with name as 'Icon' and which has a source property

 

<

 

Image x:Name="Icon" Width="48" Height="48" VerticalAlignment="Top" Margin="16 8 8 8"

 

 

Source="/Telerik.Windows.Controls.Navigation;component/themes/WindowAlertIcon.png" />

 

 

 

 

 

4) Modify the source property to any image and it will appear in the alert popup

Hope it helps to other users

 

[sravanthi]

 Hai,
I did not understand ,how u changed the image of the radalert.
can I know where can i change the image.In which file so forth information,


Thanks,
Sravanthi

[Sumati]

Copy the following code in your *.xaml file before the <Grid> tag

 

<UserControl.Resources>

 <Style x:Key="RadAlertStyle" TargetType="telerikNavigation:RadAlert">

 <Setter Property="IsTabStop" Value="false"/>

 <Setter Property="MinWidth" Value="300"/>

<Setter Property="MaxWidth" Value="700"/>
<Setter Property="Template">

 <Setter.Value>

<ControlTemplate TargetType="telerikNavigation:RadAlert">

 <Grid x:Name="LayoutRoot">

 <Grid.ColumnDefinitions>

 <ColumnDefinition Width="Auto"/>

 <ColumnDefinition Width="*"/>

 </Grid.ColumnDefinitions>

 <Grid.RowDefinitions>

 <RowDefinition Height="*"/>

 <RowDefinition Height="Auto"/>

 </Grid.RowDefinitions>

 <Image x:Name="Icon" Height="48" Margin="16 8 8 8" VerticalAlignment="Top" Width="48" Source="Image/ok.png"/>

 
<ContentPresenter Grid.Column="1" Grid.Row="0" x:Name="AlertText" Margin="8 8 8 0" />

<Border x:Name="HorizontalRule" Height="2" VerticalAlignment="Top" Grid.ColumnSpan="2" Grid.Row="1" BorderThickness="0 0 0 1"

Background="{StaticResource BorderLineOuterColor}" BorderBrush="{StaticResource BorderLineInnerColor}" />

<telerik:RadButton x:Name="OK" HorizontalAlignment="Right" Margin="0 10 8 8" MinWidth="70" Content="OK" Grid.ColumnSpan="2"

Grid.Row="2" />

</Grid>

 </ControlTemplate>

 </Setter.Value>

 </Setter>

 </Style>

 </UserControl.Resources>

The source property of <Image> tag is set to 'Source="Image/ok.png"/'
You may change it to your custom defined image.
Note that name of the style is "RadAlertStyle"

Implement the following code in the code-behind file:

 

DialogParameters dp = new DialogParameters();  

dp.Header = "Message";  

dp.Content = String.Format(message, result, Environment.NewLine);  

dp.ContentStyle = Application.Current.Resources["RadAlertStyle"] as Style;  

RadWindow.Alert(dp);

 

 

This will open the alert window with your own image icon on left

Hope this helps

[sravanthi]

Now I understand what u written.But is there anything other than ".xaml" files to change the image of the rad alert.Thanks for the quick reply.

Thanks,
Sravanthi.

[Sumati]

You may make use of Resource files but again they will be of extension *.xaml
Resource file is a single repository which can be shared between all files in a project
It easy to maintain
You will need to do some google on this topic

Hope this helps

[sravanthi]

hey ,
That was helpful but,in our project we dont use WPF .So I could not find any other solution.

Thanks,
Sravanthi

[Lauren]

Hi,

I'm using the exact example posted by Sumati, but i just can't get rid of that yellow exclamation mark and replace it by a check mark.
I'm using version 2011.2.725.1040. Maybe the RadAlert style is different in this version ?
Can anyone help on this ?
Thanks a lot.

[Sumati]

Hi Lauren,

Version that I have used is: 2010.1.603.1030
Your application dll's have newer version than mine. Probably you have will have to do more search for latest 2011..versions

Thanks
Sumati

[Dani]

Hi all,

The icon of the RadAlert dialog is hard-coded in XAML. In particular - in resources of the dialog.

If you drag a RadAlert control on the design surfice in Expression Blend and go to Edit Template > Edit a Copy, you will get the needed Style and resources for RadAlert. You simply need to replace the content of the <DataTemplate x:Key="AlertIconTemplate">.

To apply that to your own RadAlert from code-behind, place the Style in App.xaml and apply it to the dialog in the following manner:

private void RadButton_Click(object sender, RoutedEventArgs e)
        {
            RadWindow.Alert(new DialogParameters()
            {
                Content = "Hello",
                ContentStyle = Application.Current.Resources["RadAlertStyle"] as Style

            });
        }

I attach an illustrative sample created by this approach. The approach is one and the same with older and newer dll versions.

I hope this will be helpful.

Greetings,
Dani
the Telerik team

[Ralf]

Hi,

I don't understand the strategy behind the predefined dialogs. Why I can change the OKButtonConent and so on, but not the image content by using the DialogParamters class? Why to change the image is much complicated?
If I'm using the RadWindow.Alert method in code behind, I don't want to setup a style or do changes in Expression Blend. That's to much work for a little dialog. And what if I need to have different images regarding the context? Should I define a new Style for each or a very complex style to handle those requirements?
That's not usefull! Also the usage is not consistent!

So it would be perfect for us develeopers to have a property "ImageContent" or "ImageContentTemplate" in DialogParameters class within the next release of the Telerik suite.

Regards,
Ralf

[Vladi]

Hi Ralf,

Thank you for the feedback.

By design in the current version of RadWindow in order to customize the icon of the predefined windows you will need to customize the DataTemplate.

It may seam to be a difficult approach at first and if you have any issues feel free to write to us with the specific issue and we will do our best to help you solve it.

Kind regards,
Vladi
the Telerik team