WPF Memorandum (1) with a smile, Popup

Recommended for you: Get network issues from WhatsUp Gold. Not end users.

1 draw a smiling face to amuse:

 <Canvas Width="200" Height="180" VerticalAlignment="Center" Margin="772,577,466,390">
            <Ellipse Canvas.Left="10" Canvas.Top="10" Width="160" Height="160"
                     Fill="Yellow" Stroke="Black"/>
            <Ellipse Canvas.Left="45" Canvas.Top="50" Width="25" Height="30"
                     Fill="Black"/>
            <Ellipse Canvas.Left="110" Canvas.Top="50" Width="25" Height="30"
                     Fill="Black"/>
            <Path Data="M 50,100 A 30,30 0 0 0 130,100" Stroke="Black"/>
        </Canvas>

Results are as follows:


2.Xaml date format

<Label Content="{Binding TaskDate,StringFormat='yyyy-MM-dd'}" Grid.Column="3"/>

3 let the button button feeling, sweat, is not nonsense, is to make the button is pressed down feeling

 <ControlTemplate.Triggers>
                        <Trigger Property="Button.IsPressed" Value="True">
                            <Setter Property="RenderTransform">
                                <Setter.Value>
                                    <ScaleTransform ScaleX=".9" ScaleY=".9"/>
                                </Setter.Value>
                            </Setter>
                            <Setter Property="RenderTransformOrigin" Value=".5,.5"/>
                        </Trigger>
                    </ControlTemplate.Triggers>

 Using the method of 4.Popup

The 1.Popup control will not automatically display, set the IsOpen property to display the Popup control must be.

2 by default, the Popup.StaysOen property is set to True, and the Popup control will display, until explicitly set the IsOpen property to False.

If the Popup.StaysOpen property is set to False, when users elsewhere in the click of the mouse, the Popup control will disappear.

If the IsOpen control's Popup property is set to True, displays the PopupAnimation control's Popup property can be set to Popup control.

The associated Popup control without any control, so no matter where the definition of Popup tag does not matter.

 

3 the associated control can:

PlacementTarget="{Binding ElementName=button1}"   //Binding in which the control, here is the control and button1
Placement="Bottom"                   //In that position control display, here is below the control to display button1

Small example:

  

<Popup PopupAnimation="Fade"
                       Placement="Center"
                       Name="_pupup">
                    <Button>Hello</Button>
                </Popup>

The difference between 5.RenderTransform and LayoutTransform

  The only difference between RenderTransform and LayoutTransform is in when applying the transformation,

RenderTransform before rendering, which applied in the layout before. Look at the next RenderTransform:

 <StackPanel Background="Gainsboro" Width="200" Height="80" Orientation="Horizontal" Margin="366,220,12,221">
            <Button Width="75" Content="15">
                <Button.RenderTransform>
                    <RotateTransform Angle="15"></RotateTransform>
                </Button.RenderTransform>
            </Button>
            <Button Width="75" Content="45">
                <Button.RenderTransform>
                    <RotateTransform Angle="45"></RotateTransform>
                </Button.RenderTransform>
            </Button>
            <Button Width="75" Content="65">
                <Button.RenderTransform>
                    <RotateTransform Angle="65"></RotateTransform>
                </Button.RenderTransform>
            </Button>
        </StackPanel>

Effect:

Buttons appear to overlap

LayoutTransform:

<StackPanel Background="Gainsboro" Width="250" Height="80" Orientation="Horizontal" Margin="71,220,257,221">
            <Button Width="75" Content="15">
                <Button.LayoutTransform>
                    <RotateTransform Angle="15"></RotateTransform>
                </Button.LayoutTransform>
            </Button>
            <Button Width="75" Content="45">
                <Button.LayoutTransform>
                    <RotateTransform Angle="45"></RotateTransform>
                </Button.LayoutTransform>
            </Button>
            <Button Width="75" Content="65">
                <Button.LayoutTransform>
                    <RotateTransform Angle="65"></RotateTransform>
                </Button.LayoutTransform>
            </Button>
        </StackPanel>

Effect:

  Can be seen that the overlap LayoutTransform unlike RenderTransform, the panel has been changed to fully adapt to the size of the button. Because LayoutTransform

Application in the layout, so the system is fully aware of this effect.

To be continued……


Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download

Posted by Katherine at November 16, 2013 - 2:22 PM