WPF Getting Started Tutorial series 10--layout of border and Viewbox (v)

Nine. Border

Border is a decorated control that draws a border and a background, can have only one child control in Border, and to display multiple child controls, an additional Panel control needs to be placed in the parent Border. You can then place the child controls in the Panel control.

Several important properties of Border:

Background: Use a Brush object to draw the background;

BorderBrush: Use a Brush object to draw the border;

BorderThickness: This property sets the size of the Border border;

Cornerradius: This property sets the radius of each corner circle of the Border;

Padding: This r property sets the interval between the contents of the Border and the border.

Next we'll use the XAML code to make an example of playing poker by setting the properties of the border.

<window x:class= "Wpfapp1.windowborder" xmlns= "http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x= "Http://schemas.microsoft.com/winfx/2006/xaml" title= "Windowborder" height= "$" width= "> <gri" d> <canvas x:name= "Maincanvas" background= "Green" width= "height=" > <border BORDERBR Ush= "Darkgray" "borderthickness=". 0,.0,2,2 "cornerradius=" "width=", "height=" and canvas.left= "canvas.top=" "> <border borderbrush=" White "borderthickness=" 5 "cornerradius=" > <bo                            Rder borderbrush= "Black" borderthickness= "1.5" cornerradius= "> <Border.Background>                                    <ImageBrush> <ImageBrush.ImageSource> <bitmapimage urisource= "Meinv.png"/> </imagebrush.imagesource&gt                            ; &lT;/imagebrush> </Border.Background> </Border> <  /border> </Border> </Canvas> </Grid></Window>

10. ScrollViewer

Because the size of the display area of the computer screen is fixed, if we want to display to the user the content, greatly exceeds the computer screen's maximum display area, the form, the container's limited display page, then the outside part will break the original layout, this time we will use the browser-like scroll bar effect. The ScrollViewer control makes it easy to make the content in your application available with scroll bar functionality.

Next, let's do an example that looks like this:

XAML Code:

<window x:class= "Wpfapp1.windowscrollviewer"        xmlns= "http://schemas.microsoft.com/winfx/2006/xaml/ Presentation "        xmlns:x=" Http://schemas.microsoft.com/winfx/2006/xaml "        title=" Windowscrollviewer "height= "Width=" loaded= "window_loaded" >    <Grid>        <StackPanel>            <scrollviewer name= " Scroll "width=" 480 "  height=" "horizontalscrollbarvisibility=" "Auto" verticalscrollbarvisibility= "Visible" >                 <textblock    name= "txtshowarticle"   foreground= "Gray" margin= "20,10"/>             </ scrollviewer>        </StackPanel>    </Grid></Window>

C # code:

Using system;using system.collections.generic;using system.linq;using system.text;using System.Threading.Tasks; Using system.windows;using system.windows.controls;using system.windows.data;using system.windows.documents;using System.windows.input;using system.windows.media;using system.windows.media.imaging;using System.Windows.Shapes; namespace wpfapp1{//<summary>//Windowscrollviewer.xaml interactive logic///</summary> public partial C        Lass Windowscrollviewer:window {public windowscrollviewer () {InitializeComponent (); The string content = @ "The Chinese banking industry, once earning a fortune," is already at the end of the day "to lay down and make money." In the newly disclosed 2014 report of the listed bank, except Ping An bank and Pudong Bank, the remaining 8 listed banks net profit growth was lower than 10%, of which Citic Bank is only 3.87%. A number of state-owned and joint-stock banks, including ICBC, have grown at net profit this year compared with halved last year. Chinese banks ' net profit growth basically enters the single digit age. What makes the banking express slow down? In addition to the increase in non-performing loans last year, banks are facing a challenge by increasing the net profit of their provisions, the promotion of interest rate liberalization, the acceleration of financial deregulation and the menacing internet finance. The superposition of these factors is making banks say goodbye to the good days of making money, with slow growth becoming the "new norm" for banks. In fact, in addition to the test of asset quality, from a longer dimension, the changes in the policy environment facing the Chinese banking industry have slowed down the net profits of the banks in the past few years, with the "Cosmic Bank" ICBC as an example, and the net profit of 2010 and 2011 remained 28.4%, 25.6% Growth in net profit, but 2012 began sharplyTo 14.5%, the 2013 annual report was barely maintained at double-digit levels and fell further to 5.1% in 2014. So how does the bank achieve "Internet +"? In the author's opinion, the past two years, the peer, balance treasure and other new products, although the internet finance seems to be particularly lively, but for the bank, the greater significance of internet finance is not in the reconstruction of the channel, but in the value chain restructuring, "Internet +" may lead the bank to rediscover value. In addition to the seemingly hilarious use of internet channels, it is more important for banks to activate big data via the Internet and rebuild the bank's value chain. First of all, its foundation should be that its underlying ecological structure, reflected in the payment liquidation system, credit system, such as the basic technology reform. Second, in this process, the bank can realize re-value discovery, such as through the virtual account, remote account change, the retail business to move to the mobile, the development of long-tail users, and the profit from the former scale-oriented to the speed of money transfer, while the use of big data and supply chain to really open the bank small blue ocean.　A series of internet finance products released by ICBC last week have seen similar ideas around payments, social and mobile retailing.              "; private void Showarticle () {//Get message StringBuilder strmessage = new StringBuilder                         (); Strmessage.append ("title" + "stall Bank" how to implement "Internet +"?)                "+" \ r \ n ");                Strmessage.append ("Source:" + "Southern Metropolis daily" + "\ r \ n");                Strmessage.append ("Send time:" + "2015-04-02 06:31:32" + "\ r \ n");                Strmessage.append ("Send content:" + content + "\r\n\n");        Txtshowarticle.text = Strmessage.tostring (); private void Window_Loaded (object sender, RoutedEventArgs e) {showarticLe ();   }    }}

11. Layout Integrated Application

The basic usage of some commonly used panel is described in the previous nine subsections, so we will simply do a small comprehensive example, through this example, to consolidate the contents of the previous study, so as to know the new process. The effects to be achieved are as follows:

XAML Code implementations:

<window x:class= "Wpfapp1.windowcomposite" xmlns= "http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x= "Http://schemas.microsoft.com/winfx/2006/xaml" title= "Windowcomposite" height= "$" width= ">" Lt  Grid > <Grid.RowDefinitions> <rowdefinition height= "105*"/> <rowdefinition height= "/> </Grid.RowDefinitions> <dockpanel lastchildfill=" True "grid.row=" 0 "><!                　　　　　　　　                -Top, plus one menu--<menu height= "width=" Auto "name=" Menutop "dockpanel.dock=" Top ">                    　　　　　　　　　　                    <menuitem header= "file" horizontalalignment= "left" >                    　　　　　　　　                <menuitem header= "open"/> <menuitem header= "Save"/> </MenuItem> <menuitem header= "Help" horizontalalignment=           "Left" >         　　　　　　　　　　                    <menuitem header= "View Help"/> & Lt                    　　　　　　　　　　                    MenuItem header= "Technical support"/> <separator/>                　　　　　　            <menuitem header= "about"/> </MenuItem> </Menu> <!--left column--<canvas width= "X:name=" Cvsgroun D "dockpanel.dock=" left "background=" Gray "> <wrappanel width=" "X:name=" Grdtransfer "Canvas.Left" = "0" background= "skyblue" previewmouseleftbuttondown= "Grdtest_previewmouseleftbuttondown" previewmouseleftbuttonup= "Grdtest_previewmouseleftbuttonup" orientation= "horizontal" > <Button Wid Th= "height=" x:name= "btn1" background= "Skyblue"/> <button width= "height="                   E= "btn2" background= "Orange"/> <button width= "height=" x:name= "Btn3" background= "Red"/> <button width= "height=" "X:name=" "Btn4" background= "Green"/> <button width= "" "height=" "" X:name= "Btn5" d= "Yellow"/> </WrapPanel> </Canvas> <Canvas> & Lt Viewbox stretch= "Fill" > <textblock text= "middle content" background= "AliceBlue" width= "393" height= "319" ;</textblock> </Viewbox> </Canvas> </DockPanel> <!-Bottom, plus a status bar- <statusbar height= "name=" StatusBar1 "grid.row=" 1 "> <statusbarite M content= "status bar" Name= "S1" horizontalalignment= "left"/> <statusbaritem content= "" "Name            　　　　　　        = "Lblcurrtime"/> <statusbaritem content= "third column" Name= "STATUSBAR3" width= "three"/></StatusBar> </Grid> </Window> 

In fact, with the various layout controls above, you will find that the layout UI is a very easy task, and you will find that any panel can fulfill your requirements when you encounter a new UI.

WPF Getting Started Tutorial series 10--layout of border and Viewbox (v)