|
119 | 119 | </MultiTrigger> |
120 | 120 | </Style.Triggers> |
121 | 121 | </Style> |
| 122 | + <Style x:Key="CoolButton" TargetType="Button"> |
| 123 | + <Style.Setters> |
| 124 | + <Setter Property="Template"> |
| 125 | + <Setter.Value> |
| 126 | + <!-- This is a cool template we should probably move it to be some shared resource to use elsewhere --> |
| 127 | + <ControlTemplate TargetType="Button"> |
| 128 | + <Border x:Name="MrBorder" Background="{TemplateBinding Background}" CornerRadius="4" RenderTransformOrigin="0.5,0.5"> |
| 129 | + <Border.RenderTransform> |
| 130 | + <ScaleTransform x:Name="BorderScale"/> |
| 131 | + </Border.RenderTransform> |
| 132 | + <VisualStateManager.VisualStateGroups> |
| 133 | + <VisualStateGroup Name="CommonStates"> |
| 134 | + <VisualStateGroup.Transitions> |
| 135 | + <VisualTransition GeneratedDuration="0:0:0.25"> |
| 136 | + <VisualTransition.GeneratedEasingFunction> |
| 137 | + <QuadraticEase/> |
| 138 | + </VisualTransition.GeneratedEasingFunction> |
| 139 | + </VisualTransition> |
| 140 | + </VisualStateGroup.Transitions> |
| 141 | + <VisualState Name="Disabled"> |
| 142 | + <Storyboard> |
| 143 | + <DoubleAnimation Storyboard.TargetName="MrBorder" Storyboard.TargetProperty="Opacity" To="0.25" Duration="0"/> |
| 144 | + </Storyboard> |
| 145 | + </VisualState> |
| 146 | + <VisualState Name="Normal"/> |
| 147 | + <VisualState Name="MouseOver"> |
| 148 | + <Storyboard> |
| 149 | + <DoubleAnimation Storyboard.TargetName="MrBorder" Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleX)" To="1.2" Duration="0"/> |
| 150 | + <DoubleAnimation Storyboard.TargetName="MrBorder" Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleY)" To="1.2" Duration="0"/> |
| 151 | + </Storyboard> |
| 152 | + </VisualState> |
| 153 | + </VisualStateGroup> |
| 154 | + </VisualStateManager.VisualStateGroups> |
| 155 | + <ContentPresenter Margin="4"/> |
| 156 | + </Border> |
| 157 | + </ControlTemplate> |
| 158 | + </Setter.Value> |
| 159 | + </Setter> |
| 160 | + </Style.Setters> |
| 161 | + </Style> |
| 162 | + <Style x:Key="LittleSquareCoolButton" BasedOn="{StaticResource CoolButton}" TargetType="Button"> |
| 163 | + <Setter Property="Width" Value="24"/> |
| 164 | + <Setter Property="Height" Value="24"/> |
| 165 | + <Setter Property="Focusable" Value="False"/> |
| 166 | + </Style> |
122 | 167 | </UserControl.Resources> |
123 | 168 |
|
124 | 169 |
|
|
203 | 248 | </Border> |
204 | 249 |
|
205 | 250 |
|
206 | | - |
207 | | - <!-- Delete button cross thing --> |
208 | | - <Button HorizontalAlignment="Right" VerticalAlignment="Top" Padding="0" Cursor="Hand" |
209 | | - Margin="6" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" |
210 | | - Command="{Binding DeleteItem}" Width="24" Height="24" |
211 | | - KeyboardNavigation.TabNavigation="None" Focusable="False"> |
212 | | - <Button.Template> |
213 | | - <!-- This is a cool template we should probably move it to be some shared resource to use elsewhere --> |
214 | | - <ControlTemplate TargetType="Button"> |
215 | | - <Border x:Name="MrBorder" Background="{TemplateBinding Background}" CornerRadius="4" RenderTransformOrigin="0.5,0.5"> |
216 | | - <Border.RenderTransform> |
217 | | - <ScaleTransform x:Name="BorderScale"/> |
218 | | - </Border.RenderTransform> |
219 | | - <VisualStateManager.VisualStateGroups> |
220 | | - <VisualStateGroup Name="CommonStates"> |
221 | | - <VisualStateGroup.Transitions> |
222 | | - <VisualTransition GeneratedDuration="0:0:0.25"> |
223 | | - <VisualTransition.GeneratedEasingFunction> |
224 | | - <QuadraticEase/> |
225 | | - </VisualTransition.GeneratedEasingFunction> |
226 | | - </VisualTransition> |
227 | | - </VisualStateGroup.Transitions> |
228 | | - <VisualState Name="Normal"/> |
229 | | - <VisualState Name="MouseOver"> |
230 | | - <Storyboard> |
231 | | - <DoubleAnimation Storyboard.TargetName="MrBorder" Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleX)" To="1.2" Duration="0"/> |
232 | | - <DoubleAnimation Storyboard.TargetName="MrBorder" Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleY)" To="1.2" Duration="0"/> |
233 | | - </Storyboard> |
234 | | - </VisualState> |
235 | | - </VisualStateGroup> |
236 | | - </VisualStateManager.VisualStateGroups> |
237 | | - <ContentPresenter Margin="4"/> |
238 | | - </Border> |
239 | | - </ControlTemplate> |
240 | | - </Button.Template> |
241 | | - <Button.Style> |
242 | | - <Style TargetType="Button"> |
243 | | - <Style.Setters> |
244 | | - <Setter Property="Opacity" Value="0.0"/> |
245 | | - </Style.Setters> |
246 | | - <Style.Triggers> |
247 | | - <DataTrigger Binding="{Binding ElementName=LayoutRoot, Path=IsMouseOver}" Value="True"> |
248 | | - <DataTrigger.EnterActions> |
249 | | - <BeginStoryboard> |
250 | | - <Storyboard> |
251 | | - <DoubleAnimation Storyboard.TargetProperty="Opacity" To="1" |
252 | | - Duration="0:0:0.5"> |
253 | | - <DoubleAnimation.EasingFunction> |
254 | | - <CubicEase /> |
255 | | - </DoubleAnimation.EasingFunction> |
256 | | - </DoubleAnimation> |
257 | | - </Storyboard> |
258 | | - </BeginStoryboard> |
259 | | - </DataTrigger.EnterActions> |
260 | | - <DataTrigger.ExitActions> |
261 | | - <BeginStoryboard> |
262 | | - <Storyboard> |
263 | | - <DoubleAnimation Storyboard.TargetProperty="Opacity" To="0" |
264 | | - Duration="0:0:0.5"> |
265 | | - <DoubleAnimation.EasingFunction> |
266 | | - <CubicEase /> |
267 | | - </DoubleAnimation.EasingFunction> |
268 | | - </DoubleAnimation> |
269 | | - </Storyboard> |
270 | | - </BeginStoryboard> |
271 | | - </DataTrigger.ExitActions> |
| 251 | + <!-- Layer fade in/out with mouse over--> |
| 252 | + <Grid> |
| 253 | + <Grid.Style> |
| 254 | + <Style TargetType="Grid"> |
| 255 | + <Style.Setters> |
| 256 | + <Setter Property="Opacity" Value="0"/> |
| 257 | + </Style.Setters> |
| 258 | + <Style.Triggers> |
| 259 | + <DataTrigger Binding="{Binding ElementName=LayoutRoot, Path=IsMouseOver}" |
| 260 | + Value="True"> |
| 261 | + <DataTrigger.EnterActions> |
| 262 | + <BeginStoryboard> |
| 263 | + <Storyboard> |
| 264 | + <DoubleAnimation Storyboard.TargetProperty="Opacity" To="1" |
| 265 | + Duration="0:0:0.5"> |
| 266 | + <DoubleAnimation.EasingFunction> |
| 267 | + <CubicEase /> |
| 268 | + </DoubleAnimation.EasingFunction> |
| 269 | + </DoubleAnimation> |
| 270 | + </Storyboard> |
| 271 | + </BeginStoryboard> |
| 272 | + </DataTrigger.EnterActions> |
| 273 | + <DataTrigger.ExitActions> |
| 274 | + <BeginStoryboard> |
| 275 | + <Storyboard> |
| 276 | + <DoubleAnimation Storyboard.TargetProperty="Opacity" To="0" |
| 277 | + Duration="0:0:0.5"> |
| 278 | + <DoubleAnimation.EasingFunction> |
| 279 | + <CubicEase /> |
| 280 | + </DoubleAnimation.EasingFunction> |
| 281 | + </DoubleAnimation> |
| 282 | + </Storyboard> |
| 283 | + </BeginStoryboard> |
| 284 | + </DataTrigger.ExitActions> |
272 | 285 | </DataTrigger> |
273 | | - </Style.Triggers> |
274 | | - </Style> |
275 | | - </Button.Style> |
| 286 | + </Style.Triggers> |
| 287 | + </Style> |
| 288 | + </Grid.Style> |
| 289 | + |
| 290 | + <!-- Buttons in the top right --> |
| 291 | + <StackPanel HorizontalAlignment="Right" VerticalAlignment="Top" Margin="6"> |
| 292 | + <!-- Delete button --> |
| 293 | + <Button Padding="0" Cursor="Hand" |
| 294 | + ToolTip="Delete" |
| 295 | + HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" |
| 296 | + Command="{Binding DeleteItem}" |
| 297 | + Style="{StaticResource LittleSquareCoolButton}"> |
| 298 | + <Path Data="M2,2 L10,10 M2,10 L10,2" Stroke="Red" Stretch="Fill" |
| 299 | + StrokeThickness="4" StrokeEndLineCap="Round" StrokeStartLineCap="Round" /> |
| 300 | + </Button> |
| 301 | + |
| 302 | + <!-- Repair button --> |
| 303 | + <Button Padding="0" Cursor="Hand" Margin="0,2,0,0" |
| 304 | + ToolTip="Repair" |
| 305 | + HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" |
| 306 | + Command="{Binding RepairItem}" |
| 307 | + Style="{StaticResource LittleSquareCoolButton}" |
| 308 | + Visibility="{Binding Item.SharedData.UsesDurability, Converter={StaticResource BoolToVis}}"> |
| 309 | + <Image Source="Resources/wrench-32.ico" /> |
| 310 | + </Button> |
| 311 | + </StackPanel> |
| 312 | + |
| 313 | + |
| 314 | + |
| 315 | + </Grid> |
276 | 316 |
|
277 | | - <Path Data="M2,2 L10,10 M2,10 L10,2" Stroke="Red" Stretch="Fill" |
278 | | - StrokeThickness="4" StrokeEndLineCap="Round" StrokeStartLineCap="Round" /> |
279 | | - </Button> |
280 | 317 |
|
281 | 318 | </Grid> |
282 | 319 |
|
|
0 commit comments