Powered by MSDN

US - English
NEW! Silverlight 5 is available Learn More

  • HarshBardhan

    HarshBardhan

    Star

    10118 Points

    1749 Posts

    Re: How to Customize Scrollviewer for TexBox Contorl

    Sep 03, 2008 08:13 AM | LINK

    Hi,

    You Can Remove one Section from thsi then only Vertical bar will be displayed... I made alittle change here... 

    <Application.Resources>

    <Style x:Key="ScrollViewerStyle1" TargetType="ScrollViewer">

    <Setter Property="IsEnabled" Value="true"/>

    <Setter Property="Foreground" Value="#FF000000"/>

    <Setter Property="BorderBrush" Value="#FFA4A4A4"/>

    <Setter Property="BorderThickness" Value="1"/>

    <Setter Property="HorizontalContentAlignment" Value="Left"/>

    <Setter Property="VerticalContentAlignment" Value="Top"/>

    <Setter Property="Cursor" Value="Arrow"/>

    <Setter Property="TextAlignment" Value="Left"/>

    <Setter Property="TextWrapping" Value="NoWrap"/>

    <Setter Property="FontSize" Value="11"/>

    <Setter Property="VerticalScrollBarVisibility" Value="Visible"/>

    <Setter Property="Template">

    <Setter.Value>

    <ControlTemplate TargetType="ScrollViewer">

    <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="1">

    <Grid Background="{TemplateBinding Background}">

    <Grid.RowDefinitions>

    <RowDefinition Height="*"/>

    <RowDefinition Height="Auto"/>

    </Grid.RowDefinitions>

    <Grid.ColumnDefinitions>

    <ColumnDefinition Width="*"/>

    <ColumnDefinition Width="Auto"/>

    </Grid.ColumnDefinitions>

    <Rectangle Grid.Column="1" Grid.Row="1" Fill="#FFE9E9E9"/>

    <ScrollContentPresenter Cursor="{TemplateBinding Cursor}" Margin="{TemplateBinding Padding}" x:Name="ScrollContentPresenter" Background="{TemplateBinding Background}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}" Grid.Column="0" Grid.Row="0" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}" TextAlignment="{TemplateBinding TextAlignment}" TextDecorations="{TemplateBinding TextDecorations}" TextWrapping="{TemplateBinding TextWrapping}"/>

    <ScrollBar Cursor="Arrow" HorizontalAlignment="Left" Margin="0,0,0,0" x:Name="VerticalScrollBar" Width="18" Visibility="{TemplateBinding ComputedVerticalScrollBarVisibility}" Grid.Row="0" Orientation="Vertical" ViewportSize="{TemplateBinding ViewportHeight}" Maximum="{TemplateBinding ScrollableHeight}" Minimum="0" Value="{TemplateBinding VerticalOffset}" d:LayoutOverrides="Width"/>

     

    </Grid>

    </Border>

    </ControlTemplate>

    </Setter.Value>

    </Setter>

    </Style>

    </Application.Resources>

    ///Paste this in Your Page.Xaml...

    <UserControl x:Class="ListBoxSample.Page"

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    Width="400" Height="300" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d">

    <UserControl.Resources>

     

    <Style x:Key="TextBoxStyle1" TargetType="TextBox">

    <Setter Property="Template">

    <Setter.Value>

    <ControlTemplate TargetType="TextBox">

    <Grid x:Name="RootElement">

    <Grid.Resources>

    <Storyboard x:Key="Normal State">

    <DoubleAnimationUsingKeyFrames Storyboard.TargetName="FocusVisualElement" Storyboard.TargetProperty="(UIElement.Opacity)">

    <SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>

    </DoubleAnimationUsingKeyFrames>

    </Storyboard>

    <Storyboard x:Key="Focused State">

    <DoubleAnimationUsingKeyFrames Storyboard.TargetName="FocusVisualElement" Storyboard.TargetProperty="(UIElement.Opacity)">

    <SplineDoubleKeyFrame KeyTime="00:00:00" Value="1"/>

    </DoubleAnimationUsingKeyFrames>

    </Storyboard>

    </Grid.Resources>

    <ScrollViewer x:Name="ContentElement" Style="{StaticResource ScrollViewerStyle1}"/>

    <Rectangle x:Name="FocusVisualElement" IsHitTestVisible="False" Opacity="0" StrokeThickness="2" RadiusX="1" RadiusY="1" VerticalAlignment="Stretch" Margin="0,0,0,0">

    <Rectangle.Stroke>

    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

    <GradientStop Color="#FFA9B9C5" Offset="0"/>

    <GradientStop Color="#FF668499" Offset="0.325"/>

    <GradientStop Color="#FF244E6D" Offset="0.325"/>

    <GradientStop Color="#FF4F7189" Offset="1"/>

    </LinearGradientBrush>

    </Rectangle.Stroke>

    </Rectangle>

    </Grid>

    </ControlTemplate>

    </Setter.Value>

    </Setter>

    </Style>

     

     

    </UserControl.Resources>

    <Grid x:Name="LayoutRoot" Background="White">

    <TextBox Canvas.Left="300" Canvas.Top="200" VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto" Height="80" x:Name="tb123" AcceptsReturn="True" Width="200" Style="{StaticResource TextBoxStyle1}" />

     

     

     

     

    </Grid>

    </UserControl>

    Mark as answer if this post answered your question.

    Harsh Bardhan