ايجادbutton غير مستطيلي!

[mahboube]

چجوري ميشه دكمه غير مستطيلي ايجاد كرد؟ميشه اصلا؟

[مهدی فرزاد]

سلام
بله میشه بسیار ساده
فایل رو هم ضمیمه کردم ملاحضه فرمایید
البته من این کدها رو ننوشتم با Blend درست کردم:لبخند:


<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d">
<ControlTemplate x:Key="GlassButton" TargetType="{x:Type Button}">
<ControlTemplate.Resources>
<Storyboard x:Key="Storyboard1">
<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Glow" Storyboard.TargetProperty="(UIElement.Opacity)">
<SplineDoubleKeyFrame KeyTime="00:00:00.3000000" Value="1"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
<Storyboard x:Key="Storyboard2">
<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Glow" Storyboard.TargetProperty="(UIElement.Opacity)">
<SplineDoubleKeyFrame KeyTime="00:00:00.3000000" Value="0"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</ControlTemplate.Resources>
<Border BorderBrush="White" BorderThickness="1" CornerRadius="100" Margin="0">
<Border BorderThickness="1" CornerRadius="100" BorderBrush="Black">
<Border.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#7F000000" Offset="0"/>
<GradientStop Color="#7F000000" Offset="1"/>
</LinearGradientBrush>
</Border.Background>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="0.483*"/>
<RowDefinition Height="0.517*"/>
</Grid.RowDefinitions>
<Border x:Name="Glow" HorizontalAlignment="Stretch" Margin="0" Grid.RowSpan="2" BorderBrush="{x:Null}" BorderThickness="1" CornerRadius="100" Opacity="0">
<Border.Background>
<RadialGradientBrush Center="0.481,1.319" GradientOrigin="0.481,1.319" RadiusX="0.522" RadiusY="1.356">
<GradientStop Color="#B200FF00" Offset="0"/>
<GradientStop Offset="0.995"/>
</RadialGradientBrush>
</Border.Background>
</Border>
<ContentPresenter HorizontalAlignment="Center" Margin="0" VerticalAlignment="Center" Grid.RowSpan="2" Width="Auto"/>
<Border x:Name="Shine" Margin="0" BorderBrush="{x:Null}" BorderThickness="1" CornerRadius="100,100,0,0">
<Border.Background>
<LinearGradientBrush EndPoint="0.471,0.976" StartPoint="0.467,0">
<GradientStop Color="#99FFFFFF" Offset="0"/>
<GradientStop Color="#33FFFFFF" Offset="1"/>
</LinearGradientBrush>
</Border.Background>
</Border>
</Grid>
</Border>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Trigger.ExitActions>
<BeginStoryboard x:Name="Storyboard2_BeginStoryboard" Storyboard="{StaticResource Storyboard2}"/>
</Trigger.ExitActions>
<Trigger.EnterActions>
<BeginStoryboard Storyboard="{StaticResource Storyboard1}"/>
</Trigger.EnterActions>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter Property="Visibility" TargetName="Glow" Value="Hidden"/>
<Setter Property="Opacity" TargetName="Shine" Value="0.4"/>
<Setter Property="Background" TargetName="Shine">
<Setter.Value>
<LinearGradientBrush EndPoint="0.471,0.976" StartPoint="0.467,0">
<GradientStop Color="#99FFFFFF" Offset="0"/>
<GradientStop Color="C#‎‎CFFFFFF" Offset="1"/>
</LinearGradientBrush>
</Setter.Value>
</Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>

</ResourceDictionary>

[mahboube]

ممنون ولي من يه دكمه كه shape باشه(reqtangle,ellips و..)رو نمي خوام.يك دكمه ميخوام كه شكل يه عكس باشه.مثل عكسي كه تو تاپيك قبلي گذاشتم.مهم اينه كه Hint‌ دكمه هم همون عكسه باشه نه مستطيل دورش!!!
ممنون.

[مهدی فرزاد]

سلام
کافیه بجای استفاده از border برای اطراف Button از Pen استفاده کنی و هر شکلی خواستی بکشی
توی اون مثالی که براتون گذاشتم میتونی به جای Border ها این کار رو بکنی
کار با Pen رو بلدی؟؟
برات یک مثال این مدلی هم میگذارم البته 30 دقیقه دیگه

[mahboube]

سلام
کافیه بجای استفاده از border برای اطراف Button از Pen استفاده کنی و هر شکلی خواستی بکشی
توی اون مثالی که براتون گذاشتم میتونی به جای Border ها این کار رو بکنی
کار با Pen رو بلدی؟؟
برات یک مثال این مدلی هم میگذارم البته 30 دقیقه دیگه

نه كار نكردم.ممنون ولي حالا كه داري زحمت مي كشي رو عكسي كه گذاشتم بزار.
ممنون.

[mahboube]

اينم يه button غير مستطيلي ديگه:

منبع:codeproject

[مهدی فرزاد]

سلام
اینو عجله ای درست کردم
اگه دقیق تر میخوای بگذار شب که برگشتم انجام میدم
با Blend کشیدمش فایلش ضمیمه کردم

[مهدی فرزاد]

سلام
اینو یکم اصلاح کردم و کدش هم گذاشتم
ضمیمه هم کردم
درضمن از ابزار Pen در Blend استفاده شده

<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d">
<ControlTemplate x:Key="GlassButton" TargetType="{x:Type Button}">
<ControlTemplate.Resources>
<Storyboard x:Key="Storyboard1">
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)" Storyboard.TargetName="pen">
<SplineColorKeyFrame KeyTime="0:0:0.5" Value="#FFFFFF4E"/>
</ColorAnimationUsingKeyFrames>
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="pen">
<SplineColorKeyFrame KeyTime="0:0:0.5" Value="#FFFFFFB9"/>
</ColorAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Offset)" Storyboard.TargetName="pen">
<SplineDoubleKeyFrame KeyTime="0:0:0.5" Value="0.009"/>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
<Storyboard x:Key="Storyboard2">
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="pen">
<SplineColorKeyFrame KeyTime="0:0:0.5" Value="#FF476595"/>
</ColorAnimationUsingKeyFrames>
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)" Storyboard.TargetName="pen">
<SplineColorKeyFrame KeyTime="0:0:0.5" Value="#FF00173B"/>
</ColorAnimationUsingKeyFrames>
</Storyboard>
</ControlTemplate.Resources>
<Grid Margin="0">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Path x:Name="pen" Data="F1M1,1C1,1 1,216 1,216 1,216 218,216 218,216 218,216 187.876,201.516 212.368,167.018 217.156,160.273 197.136,143.093 197.136,143.093 197.136,143.093 93.115,39.34 93.115,39.34 93.115,39.34 93.548,38.127 85.03,34.582 75.902,30.783 67.71,46.201 50.178,43.035 39.965,41.191 31.304,29.749 22.899,21.513 11.478,10.321 1,1 1,1z" Width="Auto" Margin="0" VerticalAlignment="Stretch" Stretch="Fill">
<Path.Fill>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FF004BC1" Offset="0"/>
<GradientStop Color="#FF7EB0FF" Offset="0.996"/>
</LinearGradientBrush>
</Path.Fill>
</Path>
<ContentPresenter HorizontalAlignment="Left" Margin="20,0,0,0" VerticalAlignment="Center" Grid.RowSpan="2" Width="Auto" d:LayoutOverrides="GridBox"/>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Trigger.EnterActions>
<BeginStoryboard x:Name="Storyboard1_BeginStoryboard" Storyboard="{StaticResource Storyboard1}"/>
</Trigger.EnterActions>
</Trigger>
<Trigger Property="IsMouseOver" Value="False">
<Setter Property="Fill" TargetName="pen">
<Setter.Value>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FF004BC1" Offset="0"/>
<GradientStop Color="#FF7EB0FF" Offset="0.996"/>
</LinearGradientBrush>
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Trigger.ExitActions>
<BeginStoryboard Storyboard="{StaticResource Storyboard1}"/>
</Trigger.ExitActions>
<Trigger.EnterActions>
<BeginStoryboard x:Name="Storyboard2_BeginStoryboard" Storyboard="{StaticResource Storyboard2}"/>
</Trigger.EnterActions>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</ResourceDictionary>

[mahboube]

آقا واقعا لطف كردي. خيلي واجب بود.
براي يادگرفتن اين نرم افزار blend پيشنهادي نداري؟
آموزشايي شبيه آموزش lynda كه براي نرم افزاراي گرافيكيه نداره؟
ممنون.

[mahboube]

من پيشنهاد مي كنم هركي مي خواد از wpf‌استفاده كنه حتما با اين نرم افزار blend كاركنه.اگر قبلا با webapplication يا frontpage كار كرده باشد ميدونيد كه چه لطفي داره وقتي لازم نيست تگاي html رو خودتون بنويسيد!
كار اين نرم افزار هم همينه.و البته از لحاظ گرافيكي كه البته من هنوز كار نكردم زياد ولي فكر كنم بتونيد به زيباي فتوشاپ طراحي كنيد و كد xaml ش رو داشته باشد.
نكته اينجاست كه با بعضي از ابزار ها مثلا pen كه عمرا كسي بتونه باهاش به صورت دستي و باظرافت كار كنه(چون لازم داره مختصات هارو بهش بديم!!!)ولي با نرم افزار به راحتي ميشه كار كرد.