Analysis on the sub-form implementation of Family Show 2.0

The Child Window of Family Show is not implemented through the new mode/non-mode window, but through some UserControl, such as the Welcome window and Add a family member window. a window is a UserControl, if you want to see the final results of these windows during design, we recommend that you open them in Expression Blend because Expression Blend supports reading Dynamic Resources during design ), this is much more intuitive than the WPF Extension of VS2005.

In MainWindow. xaml. cs, we can find some methods starting with Show and Hidden, such as ShowDetailsPane, HideDetailsPane, HideFamilyDataControl, HideNewUserControl, ShowNewUserControl, ShowWelcomeScreen, HideWelcomeScreen, these methods are used to display and hide User Controls-that is, the subwindow we call. Take ShowWelcomeScreen and HideWelcomeScreen as examples:

/** // <Summary>
/// Show the Welcome Screen user control and hides the other controls.
/// </Summary>
Private void ShowWelcomeScreen ()
{
HideDetailsPane ();
HideNewUserControl ();
DiagramControl. Visibility = Visibility. Hidden;

WelcomeUserControl. Visibility = Visibility. Visible;
}

/** // <Summary>
/// Hides the Welcome Screen.
/// </Summary>
Private void HideWelcomeScreen ()
{
WelcomeUserControl. Visibility = Visibility. Hidden;
}

We found that apart from setting WelcomeUserControl. Visibility to Hidden, other user controls that should not be displayed are also Hidden.

In addition, these user controls are directly initialized in Xaml. You can find them in MainWindow. xaml: <! -- New User Control -->
<Local: NewUserControl x: Name = "NewUserControl" HorizontalAlignment = "Center" verticalignment = "Center" AddButtonClick = "Hangzhou" CloseButtonClick = "NewUserControl_CloseButtonClick"/>

<! -- Welcome User Control -->
<Local: Welcome x: name = "WelcomeUserControl" align = "Center" VerticalAlignment = "Center" ImportButtonClick = "inline" NewButtonClick = "inline" OpenButtonClick = "inline" OpenRecentFileButtonClick = "inline"/>

<! -- Person Info Control -->
<Local: PersonInfo x: Name = "PersonInfoControl" Opacity = "0" Visibility = "Hidden" CloseButtonClick = "PersonInfoControl_CloseButtonClick"/>

<! -- Family Data Control -->
<Local: FamilyData x: Name = "FamilyDataControl" Opacity = "0" Visibility = "Hidden" CloseButtonClick = "FamilyDataControl_CloseButtonClick"/>

Such a statement will also be in MainWindow. g. generate a corresponding internal variable in cs, such as internal Microsoft. familyShow. welcome WelcomeUserControl; this is a bit like ASP. NET aspx declare the asp.net control (in aspx. cs also generates a corresponding control variable ).

In this declaration, we will see some event definitions, such as AddButtonClick and CloseButtonClick. These events are actually routing events in WPF. The so-called routing event means that when an event is triggered, the trigger message will traverse the visual tree and logic tree, so that other parent controls or child controls can be notified to make appropriate responses, because this type of event can be transmitted along the tree, it is called a routing event. To define a routing event, you must provide a public event attribute. For example, the OpenButtonClick attribute of WelcomeUserControl is a typical event attribute. Let's take a look at its definition: // Expose this event for this control's container
Public event RoutedEventHandler OpenButtonClick
{
Add {AddHandler (OpenButtonClickEvent, value );}
Remove {RemoveHandler (OpenButtonClickEvent, value );}
}

However, it is not enough to have such a property. There is also a registration action to tell the event manager of WPF That This Is A routing event: public static readonly RoutedEvent OpenButtonClickEvent = EventManager. RegisterRoutedEvent (
"OpenButtonClick", RoutingStrategy. Bubble, typeof (RoutedEventHandler), typeof (Welcome ));

Here, the parameter specifies the routing policy as Bubble, that is, Bubble. For details about the differences between the routing policies, refer to the "WPF Unleashed" for details; the first parameter name is specified as OpenButtonClick, which is the name of the event attribute we just defined. However, please note that the value of this parameter can be different from the event attribute we just specified, it's just a key. So far, we have not specified the control to trigger this routing event, so we have the following code:

Private void OpenButton_Click (object sender, RoutedEventArgs e)
{
RaiseEvent (new RoutedEventArgs (OpenButtonClickEvent ));
}

This is the code that triggers the event. The OpenButton_Click corresponds to the Click Event of the Open button in the Welcome user control. Therefore, if you write a WPF program later, you can consider using User Control instead of Window to develop the application by referring to the family show program model. In this way, you do not need to consider the interaction between windows, it is processed in a window from start to end. For those Flash developers, this mode is even more familiar. You can understand User Control as a MovieClip object.

Let's take a look at the structure of the subwindow,

Welcome User Control

NewUserControl

Since its launch, WPF has been emphasizing the UI design. The window of Family Show is a good embodiment of this. Of course, this is definitely not because these windows are beautiful, this is because window design is more and more like web page design. We take the Welcome user control as an example to do some analysis:

In this figure, the entire window is divided into three parts: Header, Content, and Footer. The entire window is placed in a StackPanel, and the three parts are controlled by a Border as the container. Footer's implementation is the simplest. The Border control only has one Label control. The Border of the Header has a Grid, and the Welcome text is a TextBlock control, the subsequent figure is a Rectangle control (using dynamic resource WelcomeHeaderBg as the Fill value, this dynamic resource is actually a DrawingBrush, so it can be assigned to Rectangle. fill); the implementation of Content is more complex. A Grid is also used for layout, and three buttons New, Open, and Import are placed in a StackPanel, the gray horizontal line is a GridSplitter, and Open Recent is actually a Label control. In fact, there is also a StackPanel control under OpenRecent to display the list of recently opened files, because the file list is generated by code, no data is found here. (If you see this user control in Expression Blend, there is a tree view in the Object and Timeline window, you can easily understand the inclusion relationship of the layout control .)

From the perspective of the layout of this window, do you think that webpage design is becoming more and more appealing? The style in WPF is actually introduced from css, although it is much more powerful than css, however, this concept is definitely a reference. From this point of view, WPF is changing the concept and the user interface design will become more and more convenient in the future, we no longer need some third-party skin mechanisms to implement friendly and beautiful interfaces. We can simply use WPF to solve this problem. Of course, this concept may be too fashionable for those who used to develop WinForm, it takes a long time for a large number of developers to accept this idea.