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

How to add image on AutoHide area button ?

2 Answers 64 Views
Docking
This is a migrated thread and some comments may be shown as answers.
Ravi
Top achievements
Rank 1
Ravi asked on 27 Sep 2012, 09:29 AM
Hi,
I want to add a image in auto hide area, for your understand i have attached a image please check once.
I want to add that image in Style(instead of adding in window) so that it will be available in all projects.

Regards,
Srinvias.

2 Answers, 1 is accepted

Sort by
0
George
Telerik team
answered on 01 Oct 2012, 03:22 PM
Hello Srinivas,

Please, refer to the following online article how to add image to the RadPane - http://www.telerik.com/help/wpf/raddocking-how-to-add-icon-pane-header.html. Please, note that this image will be visible either the pane is pinned or not, but you could bind the image visibility to the RadPane.IsPinned property so when the pane is pinned, the image will be collapsed.

Hope this helps.

Kind regards,
George
the Telerik team

Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

0
Michael
Top achievements
Rank 1
answered on 09 Nov 2012, 08:31 PM
<UserControl x:Class="Demo.AppHeader"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"        
             xmlns:ccControls="clr-namespace:Demo.Controls;"
             mc:Ignorable="d">
    <UserControl.Resources>
        <ccControls:PositiveNumberVisibleConverter x:Key="convPostiveToVisible"/>
    </UserControl.Resources>
    <Grid>
       <StackPanel Orientation="Horizontal" MinWidth="90" Margin="0,0,15,0">
            <Image Height="{Binding ImageHeight}" Margin="3" Source="{Binding ImageSource}" />
            <TextBlock Text="{Binding Text}" Margin="5,0" VerticalAlignment="Center" FontSize="{Binding FontSize}" FontWeight="Bold" />
       </StackPanel>
        <StackPanel  Visibility="{Binding AlertCount, Converter={StaticResource convPostiveToVisible}}" Opacity="1" HorizontalAlignment="Right" VerticalAlignment="Top" Margin="0,2,2,0">
            <Border MinWidth="13" Height="15" CornerRadius="5" BorderBrush="#E23923" Background="#F03D25">
                <TextBlock TextAlignment="Center" Margin="2,0" VerticalAlignment="Center" Text="{Binding AlertCount}" Foreground="White" FontWeight="Bold"/>
            </Border>
        </StackPanel>
    </Grid>
</UserControl>

public partial class AppHeader : UserControl
    {
        public static readonly DependencyProperty TextProperty = DependencyProperty.Register("Text", typeof(string), typeof(AppHeader), null);
        public static readonly DependencyProperty ImageSourceProperty = DependencyProperty.Register("ImageSource", typeof(ImageSource), typeof(AppHeader), null);
        public static readonly DependencyProperty FontSizeProperty = DependencyProperty.Register("FontSize", typeof(double), typeof(AppHeader), null);
        public static readonly DependencyProperty ImageHeightProperty = DependencyProperty.Register("ImageHeight", typeof(double), typeof(AppHeader), null);
        public static readonly DependencyProperty AlertCountProperty = DependencyProperty.Register("AlertCount", typeof(int), typeof(AppHeader), null);
 
        public AppHeader()
        {
            InitializeComponent();
 
            this.DataContext = this;
            this.FontSize = 12;
            this.ImageHeight = 16;
            this.AlertCount = 0;
        }
 
        public string Text
        {
            get
            {
                return (string)GetValue(TextProperty);
            }
            set
            {
                SetValue(TextProperty, value);
            }
        }
 
        public ImageSource ImageSource
        {
            get
            {
                return (ImageSource)GetValue(ImageSourceProperty);
            }
            set
            {
                SetValue(ImageSourceProperty, value);
            }
        }
 
        public double FontSize
        {
            get
            {
                return (double)GetValue(FontSizeProperty);
            }
            set
            {
                SetValue(FontSizeProperty, value);
            }
        }
 
        public double ImageHeight
        {
            get
            {
                return (double)GetValue(ImageHeightProperty);
            }
            set
            {
                SetValue(ImageHeightProperty, value);
            }
        }
 
        public int AlertCount
        {
            get
            {
                return (int)GetValue(AlertCountProperty);
            }
            set
            {
                SetValue(AlertCountProperty, value);
            }
        }
 
        public override string ToString()
        {
            return this.Text;
        }
    }

public class PositiveNumberVisibleConverter : IValueConverter
    {
        #region IValueConverter Members
 
        public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            if (value is int)
            {
                if ((int)value > 0)
                    return System.Windows.Visibility.Visible;
            }
 
            return System.Windows.Visibility.Collapsed;
        }
 
        public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            return null;
        }
 
        #endregion
    }

How to use:
<telerik:RadPane x:Name="rpHistory"  IsSelected="False" ContextMenuTemplate="{x:Null}" CanUserPin="False" IsPinned="False" CanDockInDocumentHost="False"  CanFloat="False" CanUserClose="False" >
                                <!-- Your controls here -->
                                <telerik:RadPane.Header>
                                    <maestro:AppHeader Text="History" ImageSource="/Demo;component/Images/history.png" />
                                </telerik:RadPane.Header>
                            </local:RadPane>

Tags
Docking
Asked by
Ravi
Top achievements
Rank 1
Answers by
George
Telerik team
Michael
Top achievements
Rank 1
Share this question
or