Differences

This shows you the differences between two versions of the page.

--- swdev:dotnet:focus_scopes [2010/12/09 10:13]
smayr
+++ swdev:dotnet:focus_scopes [2010/12/09 10:29] (current)
smayr [Logical Focus]
@@ Line 1: / Line 1: @@
 == Focus Scopes ==
-Sometimes, controls need to be grouped into focus scopes so that there is always a focused control in that group, irrespective of the actual keyboard focus (there can only be one keyboard focused control in an application at any given time).
+Sometimes, controls need to be grouped into focus scopes so that there is always a logically focused control in that group, irrespective of the actual keyboard focus (there can only be one keyboard focused control in an application at any given time).
-To create a focus scope, make a parent control:
+=== Logical Focus ===
+To create a logical focus scope, make a parent control to be include ''FocusManager.IsFocusScope="True"'':
 <code xml>
 <StackPanel Name="pnlsideButtonsMain" FocusManager.IsFocusScope="True">
     <Button.../>
     <Button.../>
-    <Button.../>
+    <Button Name="btnReports".../>
 </StackPanel>
 </code>
@@ Line 17: / Line 18: @@
 FocusManager.SetIsFocusScope(pnlsideButtonsMain, true);
 </code>
+To set the focus in a control (eg. a button, in this case called ''btnReports''):
+<code csharp>
+// Sets the focused element in focus scope pnlsideButtonsMain
+// pnlsideButtonsMain is a StackPanel.
+FocusManager.SetFocusedElement(pnlsideButtonsMain, btnReports);
+</code>
+=== Focus Styles ===
+To style a control to show keyboard focus and logical focus:
+<code xml>
+<Style x:Key="ButtonSimpleStyles" TargetType="{x:Type Button}">
+    <Setter .../>
+    <Setter .../>
+    <Setter Property="Template">
+        <Setter.Value>
+            <ControlTemplate TargetType="{x:Type Button}">
+                <Border ...
+                      x:Name="Border"
+                      CornerRadius="7"
+                      BorderThickness="1"
+                      BorderBrush="SteelBlue">
+                      <ContentPresenter
+                        Margin="2"
+                        HorizontalAlignment="Center"
+                        VerticalAlignment="Center"
+                        RecognizesAccessKey="True"/>
+                </Border>
+                <ControlTemplate.Triggers>
+                    <!--Keyboard focus-->
+                    <Trigger Property="IsKeyboardFocused" Value="true">
+                        <Setter TargetName="Border" Property="BorderBrush" Value="SteelBlue" />
+                        <Setter TargetName="Border" Property="Background" Value="{StaticResource MyGlassBlueBrushResource}" />
+                        <Setter Property="Foreground" Value="White" />
+                    </Trigger>
+                    <!--Logical focus (within focus scope)-->
+                    <Trigger Property="IsFocused" Value="true">
+                        <Setter TargetName="Border" Property="BorderBrush" Value="SteelBlue" />
+                        <Setter TargetName="Border" Property="Background" Value="{StaticResource MyGlassBlueBrushResource}" />
+                        <Setter Property="Foreground" Value="White" />
+                    </Trigger>
+                    ...
+                </ControlTemplate.Triggers>
+            </ControlTemplate>
+        </Setter.Value>
+    </Setter>
+</Style>
+</code>
+== References ==
+  * [[http://msdn.microsoft.com/en-us/library/aa969768.aspx|MSDN: Focus Overview]]