
Michael Fooks
Top achievements
Rank 1
Michael Fooks
asked on 28 Jan 2010, 07:04 AM
Adding a longish text string to the Alert/Prompt/Confirm cuts off the text and you lose the prompt buttons e.g:
Is there a way to make the text wrap/window height grow?
Humpty Dumpty sat on a wall. Humpty dumpty had a great fall. All the kings horses and all the kings men couldn't put humpty together again. Jack and Jill went up a hill to fetch a pale of water. Jack fell down and broke his crown
Is there a way to make the text wrap/window height grow?
10 Answers, 1 is accepted
0
Hello Bronwen,
Thank you for contacting us.
To wrap the text in the Alert window, you will need to set the Width property of the Alert. This is achieved by setting a custom style to the Alert. In this style you should also replace the Content Control, which holds the Alert content, with a TextBlock and set its TextWrapping property to "Wrap".
Attached, you will find a sample running project, which illustrates the above-mentioned approach.
If you have further questions please feel free to contact us again.
Greetings,
Konstantina
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Thank you for contacting us.
To wrap the text in the Alert window, you will need to set the Width property of the Alert. This is achieved by setting a custom style to the Alert. In this style you should also replace the Content Control, which holds the Alert content, with a TextBlock and set its TextWrapping property to "Wrap".
Attached, you will find a sample running project, which illustrates the above-mentioned approach.
If you have further questions please feel free to contact us again.
Greetings,
Konstantina
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0

Michael Fooks
Top achievements
Rank 1
answered on 03 Feb 2010, 06:42 AM
Thanks for that. I just thought maybe the text wrapping should be the default behaviour rather than us having to create a style for each of the windows + theming on top of that.
0

Kareema
Top achievements
Rank 2
answered on 01 Mar 2012, 12:47 PM
Hi, I'd also like to make use of the custom style you've provided, but it doesn't match the theme style of my window. Could you provide a style with an exclamation mark icon that looks like the one I've attached?
0
Hi Kareema,
I strongly recommend that you upgrade to a later version of the control, as your custom style will most probably be inconsistent with the latest xaml od RadWindow.
The icon itself is easily obtainable from Expression Blend. If you drag a RadAlert control onto the design surface and edit its template, you will find the xaml for the alert icon.
I also include it below for yoor convenience:
I hope this helps.
Greetings,
Dani
the Telerik team
I strongly recommend that you upgrade to a later version of the control, as your custom style will most probably be inconsistent with the latest xaml od RadWindow.
The icon itself is easily obtainable from Expression Blend. If you drag a RadAlert control onto the design surface and edit its template, you will find the xaml for the alert icon.
I also include it below for yoor convenience:
<
DataTemplate
x:Key
=
"AlertIconTemplate"
>
<
Grid
Height
=
"44"
Width
=
"46"
>
<
Path
Stretch
=
"Fill"
Margin
=
"-22.792,0,0,0.274"
RenderTransformOrigin
=
"0.749972820281982,0.500000059604645"
Data
=
"M24.177877,0.032801032 C24.973236,0.35406893 25.418495,1.4006116 25.418495,1.4006121 C25.418495,1.4006116 46.196983,38.359432 46.196983,40.912521 C46.196983,43.465626 43.744934,43.759003 43.744934,43.759003 L23.09598,43.759003 L2.4520493,43.758999 C2.4520493,43.758999 0,43.465626 0,40.912521 C0,38.359428 20.841993,1.4006089 20.841993,1.4006094 C20.841993,1.4006089 21.290586,0.35406619 22.085945,0.032798279 z"
HorizontalAlignment
=
"Left"
Width
=
"46.197"
>
<
Path.Fill
>
<
LinearGradientBrush
EndPoint
=
"0.378,0.983"
StartPoint
=
"0.622,0.017"
>
<
GradientStop
Color
=
"#FFFFDA45"
Offset
=
"0.325"
/>
<
GradientStop
Color
=
"#FFFF9945"
Offset
=
"1"
/>
</
LinearGradientBrush
>
</
Path.Fill
>
<
Path.RenderTransform
>
<
TransformGroup
>
<
ScaleTransform
ScaleX
=
"-1"
/>
<
SkewTransform
AngleX
=
"0"
AngleY
=
"0"
/>
<
RotateTransform
Angle
=
"0"
/>
<
TranslateTransform
X
=
"-2.6427077841617574E-06"
/>
</
TransformGroup
>
</
Path.RenderTransform
>
</
Path
>
<
Path
Stretch
=
"Fill"
Margin
=
"-22.792,17.862,0,0.274"
RenderTransformOrigin
=
"0.749972820281982,0.500000059604645"
Data
=
"M44.972065,37.721554 C45.75716,39.384399 46.196983,40.533127 46.196983,40.912521 C46.196983,43.465626 43.744934,43.759003 43.744934,43.759003 L23.09598,43.759003 L2.4520493,43.758999 C2.4520493,43.758999 0,43.465626 0,40.912521 C0,39.551815 5.8988295,28.605951 11.450073,18.315256 C11.575222,18.08326 44.685875,37.115395 44.972065,37.721554 z"
HorizontalAlignment
=
"Left"
Width
=
"46.197"
>
<
Path.RenderTransform
>
<
TransformGroup
>
<
ScaleTransform
ScaleX
=
"-1"
/>
<
SkewTransform
AngleX
=
"0"
AngleY
=
"0"
/>
<
RotateTransform
Angle
=
"0"
/>
<
TranslateTransform
X
=
"-2.6427077841617574E-06"
/>
</
TransformGroup
>
</
Path.RenderTransform
>
<
Path.Fill
>
<
LinearGradientBrush
EndPoint
=
"0.378,0.983"
StartPoint
=
"0.524,0.404"
>
<
GradientStop
Color
=
"#FFFCB827"
Offset
=
"0.675"
/>
<
GradientStop
Color
=
"#FFFE9A0A"
Offset
=
"0.122"
/>
</
LinearGradientBrush
>
</
Path.Fill
>
</
Path
>
<
Path
Stretch
=
"Fill"
Margin
=
"-21.842,1.273,0,0.647"
RenderTransformOrigin
=
"0.749972820281982,0.500000059604645"
Data
=
"M24.177877,0.032801032 C24.973236,0.35406893 25.201269,1.4006116 25.201269,1.4006121 C25.201269,1.4006116 45.979759,38.359432 45.979759,40.912521 C45.979759,43.465626 43.52771,43.626354 43.52771,43.626354 L23.09598,43.626354 L2.8015947,43.62635 C2.8015947,43.62635 0.34954548,43.465626 0.34954548,40.912521 C0.34954548,38.359428 21.19154,1.4006089 21.19154,1.4006094 C21.19154,1.4006089 21.640133,0.35406619 22.435492,0.032798279 z"
Stroke
=
"#FFFEF065"
HorizontalAlignment
=
"Left"
Width
=
"44.514"
>
<
Path.RenderTransform
>
<
TransformGroup
>
<
ScaleTransform
ScaleX
=
"-1"
/>
<
SkewTransform
AngleX
=
"0"
AngleY
=
"0"
/>
<
RotateTransform
Angle
=
"0"
/>
<
TranslateTransform
X
=
"0.80997209357889233"
/>
</
TransformGroup
>
</
Path.RenderTransform
>
</
Path
>
<
Path
Stretch
=
"Fill"
Height
=
"17.453"
Margin
=
"6,0,6,0.522"
VerticalAlignment
=
"Bottom"
Data
=
"M179.65936,132.98976 L209.18358,132.98976 C209.18358,132.98976 207.00056,119.53224 194.23856,119.53224 C182.50038,119.53224 179.65936,132.98976 179.65936,132.98976 z"
>
<
Path.OpacityMask
>
<
RadialGradientBrush
GradientOrigin
=
"0.502,0.9"
>
<
GradientStop
Color
=
"#A8FFD100"
Offset
=
"0.404"
/>
<
GradientStop
Color
=
"Transparent"
Offset
=
"0.914"
/>
<
GradientStop
Color
=
"#A0DCA209"
Offset
=
"0.238"
/>
</
RadialGradientBrush
>
</
Path.OpacityMask
>
<
Path.Fill
>
<
LinearGradientBrush
EndPoint
=
"0.5,1"
StartPoint
=
"0.5,0"
>
<
GradientStop
Color
=
"#24FEF9BA"
Offset
=
"1"
/>
<
GradientStop
Color
=
"#BBFBFC18"
Offset
=
"0.913"
/>
<
GradientStop
Color
=
"#48FED72C"
Offset
=
"0.272"
/>
</
LinearGradientBrush
>
</
Path.Fill
>
</
Path
>
<
Path
Stretch
=
"Fill"
Margin
=
"-23,0,0,0.274"
RenderTransformOrigin
=
"0.749972820281982,0.500000059604645"
Data
=
"M24.177877,0.032801032 C24.973236,0.35406893 25.418495,1.4006116 25.418495,1.4006121 C25.418495,1.4006116 46.196983,38.359432 46.196983,40.912521 C46.196983,43.465626 43.744934,43.759003 43.744934,43.759003 L23.09598,43.759003 L2.4520493,43.758999 C2.4520493,43.758999 0,43.465626 0,40.912521 C0,38.359428 20.841993,1.4006089 20.841993,1.4006094 C20.841993,1.4006089 21.290586,0.35406619 22.085945,0.032798279 z"
HorizontalAlignment
=
"Left"
Width
=
"46.197"
>
<
Path.RenderTransform
>
<
TransformGroup
>
<
ScaleTransform
ScaleX
=
"-1"
/>
<
SkewTransform
AngleX
=
"0"
AngleY
=
"0"
/>
<
RotateTransform
Angle
=
"0"
/>
<
TranslateTransform
X
=
"-2.6427077841617574E-06"
/>
</
TransformGroup
>
</
Path.RenderTransform
>
<
Path.Stroke
>
<
LinearGradientBrush
EndPoint
=
"0.5,1"
StartPoint
=
"0.5,0"
>
<
GradientStop
Color
=
"#FFF66E04"
Offset
=
"0"
/>
<
GradientStop
Color
=
"#FFC35602"
Offset
=
"1"
/>
</
LinearGradientBrush
>
</
Path.Stroke
>
</
Path
>
<
Path
Stretch
=
"Fill"
Margin
=
"19.923,13.002,0,14.998"
Data
=
"M118.27322,79.474892 C118.27322,79.474892 118.85989,78.476952 119.21207,78.418251 C119.56425,78.359558 121.20724,78.418251 121.20724,78.418251 C121.20724,78.418251 121.9702,79.122696 122.02888,79.298744 C122.08757,79.474792 122.08733,91.269852 122.08733,91.269852 L121.14874,92.795433 L119.1532,92.79541 L118.21424,91.269402 z"
Fill
=
"White"
HorizontalAlignment
=
"Left"
Width
=
"5"
/>
<
Ellipse
Fill
=
"White"
Height
=
"6"
Margin
=
"19,0,0,5"
VerticalAlignment
=
"Bottom"
HorizontalAlignment
=
"Left"
Width
=
"6"
/>
</
Grid
>
</
DataTemplate
>
I hope this helps.
Greetings,
Dani
the Telerik team
Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
0
.jpg)
Martin
Top achievements
Rank 2
answered on 24 Apr 2013, 08:20 AM
Telerik this is something the control should handle out of the box
0
Hello Martin,
The reason it is so hard to modify the RadAlert icon is because it is a modal window.
Changing the icon of the RadAlertWindow can be achieved only by modifying a control template of RadAlertWindow style. You can always use RadWindow and use its Icon property.
Please let me know if you have any questions how to change the RadAlert icon.
All the best,
Masha
the Telerik team
The reason it is so hard to modify the RadAlert icon is because it is a modal window.
Changing the icon of the RadAlertWindow can be achieved only by modifying a control template of RadAlertWindow style. You can always use RadWindow and use its Icon property.
Please let me know if you have any questions how to change the RadAlert icon.
All the best,
Masha
the Telerik team
Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.
0

N Mackay
Top achievements
Rank 1
answered on 21 May 2013, 08:35 AM
I'd have to agree with Martin, it's a pain and the workaround isn't really acceptable.
0

Chetan
Top achievements
Rank 1
answered on 01 Jan 2014, 05:28 AM
I am having smiler problem,
I have checked the attached project but Theme.xaml is not found.
I have created style as below for radalert content. its display as required, but on click my button window not get close,
( if i remove content style then default rad button shows and on click window get closed)
please help to sort out same.
also i have checked with Command="telerik:WindowCommands.Close" but then the button become enable = false
I have checked the attached project but Theme.xaml is not found.
I have created style as below for radalert content. its display as required, but on click my button window not get close,
( if i remove content style then default rad button shows and on click window get closed)
please help to sort out same.
<
DataTemplate
x:Key
=
"AlertIconTemplate"
>
<
Path
Fill
=
"{telerik:Windows8TouchResource ResourceKey=MediumBrush}"
Height
=
"32"
Stretch
=
"Fill"
Width
=
"8"
Data
=
"F1M242.9468,305.3369L242.4158,318.8359L238.9138,318.8359L238.4058,305.3369z M243.1938,322.9739C243.1938,323.6119,242.9678,324.1499,242.5098,324.5869C242.0558,325.0239,241.4528,325.2429,240.7068,325.2429C239.9668,325.2429,239.3618,325.0199,238.8928,324.5719C238.4228,324.1259,238.1878,323.5939,238.1878,322.9739C238.1878,322.3169,238.4268,321.7809,238.9048,321.3619C239.3888,320.9439,239.9828,320.7339,240.7068,320.7339C241.4328,320.7339,242.0308,320.9459,242.4968,321.3689C242.9618,321.7909,243.1938,322.3269,243.1938,322.9739"
/>
</
DataTemplate
>
<
Style
x:Key
=
"RadAlertStyle"
TargetType
=
"{x:Type telerik:RadAlert}"
>
<
Setter
Property
=
"IsTabStop"
Value
=
"False"
/>
<
Setter
Property
=
"MinWidth"
Value
=
"275"
/>
<
Setter
Property
=
"MaxWidth"
Value
=
"500"
/>
<
Setter
Property
=
"SnapsToDevicePixels"
Value
=
"True"
/>
<
Setter
Property
=
"Template"
>
<
Setter.Value
>
<
ControlTemplate
TargetType
=
"{x:Type telerik:RadAlert}"
>
<
Grid
x:Name
=
"LayoutRoot"
>
<
Grid.ColumnDefinitions
>
<
ColumnDefinition
Width
=
"Auto"
/>
<
ColumnDefinition
Width
=
"*"
/>
</
Grid.ColumnDefinitions
>
<
Grid.RowDefinitions
>
<
RowDefinition
Height
=
"*"
/>
<
RowDefinition
Height
=
"Auto"
/>
</
Grid.RowDefinitions
>
<
ContentPresenter
x:Name
=
"Icon"
Content
=
"{TemplateBinding Content}"
Margin
=
"16,8,8,8"
VerticalAlignment
=
"Top"
ContentTemplate
=
"{StaticResource AlertIconTemplate}"
>
</
ContentPresenter
>
<
ScrollViewer
Grid.Column
=
"1"
HorizontalScrollBarVisibility
=
"Hidden"
Margin
=
"0,0,0,8"
Grid.Row
=
"0"
VerticalScrollBarVisibility
=
"Auto"
>
<
ContentPresenter
x:Name
=
"AlertText"
ContentTemplate
=
"{TemplateBinding ContentTemplate}"
Content
=
"{TemplateBinding Content}"
ContentStringFormat
=
"{TemplateBinding ContentStringFormat}"
Margin
=
"8,8,8,0"
VerticalAlignment
=
"Center"
/>
</
ScrollViewer
>
<
Border
x:Name
=
"HorizontalRule"
BorderBrush
=
"White"
BorderThickness
=
"0,0,0,1"
Background
=
"#26000000"
Grid.ColumnSpan
=
"2"
Height
=
"2"
Grid.Row
=
"1"
VerticalAlignment
=
"Top"
/>
<
StackPanel
x:Name
=
"DialogButtons"
Grid.ColumnSpan
=
"2"
HorizontalAlignment
=
"Right"
Orientation
=
"Horizontal"
Grid.Row
=
"2"
>
<
telerik:RadButton
x:Name
=
"Ok"
Cursor
=
"Hand"
Margin
=
"10,10,8,8"
MinWidth
=
"48"
Style
=
"{DynamicResource roundBtnWthEfects}"
>
<
Image
Height
=
"42"
Width
=
"42"
Stretch
=
"Fill"
Source
=
"/myproject;component/Assets/Images/oknew.png"
/>
</
telerik:RadButton
>
</
StackPanel
>
</
Grid
>
</
ControlTemplate
>
</
Setter.Value
>
</
Setter
>
</
Style
>
<
Style
TargetType
=
"{x:Type telerik:RadButton}"
x:Key
=
"roundBtnWthEfects"
>
<
Setter
Property
=
"Width"
Value
=
"42"
/>
<
Setter
Property
=
"Height"
Value
=
"42"
/>
<
Setter
Property
=
"Template"
>
<
Setter.Value
>
<
ControlTemplate
TargetType
=
"Button"
>
<
Grid
Name
=
"grid"
RenderTransformOrigin
=
"0.5,0.5"
Width
=
"{TemplateBinding Width}"
Height
=
"{TemplateBinding Height}"
ClipToBounds
=
"True"
>
<!-- Outer Rectangle with rounded corners. -->
<
Ellipse
x:Name
=
"outerEllipse"
Opacity
=
".6"
Fill
=
"Transparent"
StrokeThickness
=
"2"
Stroke
=
"#80000000"
/>
<!-- Present Content (text) of the button. -->
<
ContentPresenter
x:Name
=
"myContentPresenter"
Opacity
=
".6"
Content
=
"{TemplateBinding Content}"
TextBlock.Foreground
=
"Black"
/>
</
Grid
>
<
ControlTemplate.Triggers
>
<
Trigger
Property
=
"IsPressed"
Value
=
"True"
>
<
Setter
Property
=
"Ellipse.Fill"
TargetName
=
"outerEllipse"
Value
=
"{StaticResource btnPressedColor}"
/>
</
Trigger
>
<
Trigger
Property
=
"IsMouseOver"
Value
=
"True"
>
<
Setter
Property
=
"ContentPresenter.Opacity"
TargetName
=
"myContentPresenter"
Value
=
"1"
/>
<
Setter
Property
=
"Ellipse.Opacity"
TargetName
=
"outerEllipse"
Value
=
"1"
/>
<
Setter
Property
=
"Ellipse.Stroke"
TargetName
=
"outerEllipse"
Value
=
"#FF000000"
/>
</
Trigger
>
<
Trigger
Property
=
"IsEnabled"
Value
=
"False"
>
<
Setter
Property
=
"ContentPresenter.Opacity"
TargetName
=
"myContentPresenter"
Value
=
"0.1"
/>
<
Setter
Property
=
"Ellipse.Opacity"
TargetName
=
"outerEllipse"
Value
=
"0.1"
/>
</
Trigger
>
</
ControlTemplate.Triggers
>
</
ControlTemplate
>
</
Setter.Value
>
</
Setter
>
</
Style
>
also i have checked with Command="telerik:WindowCommands.Close" but then the button become enable = false
0
Hi Chetan,
The default command for the button in the Alert is Command="telerik:WindowCommands.Confirm" please try give it a try. I tested it in a sample project and it worked as expected.
Hope this helps.
Regards,
Kalin
Telerik
The default command for the button in the Alert is Command="telerik:WindowCommands.Confirm" please try give it a try. I tested it in a sample project and it worked as expected.
Hope this helps.
Regards,
Kalin
Telerik
TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for WPF.
Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
Sign up for Free application insights >>
Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
Sign up for Free application insights >>
0

Chetan
Top achievements
Rank 1
answered on 15 Jan 2014, 09:51 AM
Thanks for reply,
I have found other problem in my code in style i change x:name of ok button to "Ok" and when revert to "OK" it works
:)
I have found other problem in my code in style i change x:name of ok button to "Ok" and when revert to "OK" it works
:)