WPF基础学习

WPF学习

基础需要比较少
WPF是用来替代WinForm
WPF的核心:XAML技术,平板电脑开发, Windows Phone手机开发
______________________________________________________________________________________________
控件
比较常用的事件button(click) Loaded事件
控件名字取得要有意义
Focus()获取焦点

______________________________________________________________________________________________
集合

List<int> list = new List<int>();
list.Add(123);
list.Add(234);
list.Remove(123);
list.Clear();

______________________________________________________________________________________________
手写XAML是必须的过程,就像手写HTML一样的; 学从难处学,易从易处用
XAML语法

属性值必须是双引号

闭合结构,有开始,有结束

大小写敏感

每个节点就是一个控件,每一个XAML标签都可以new出来

属性值有两种赋值方法,一直接=; 二是

<Button  Height="23" HorizontalAlignment ="Left" Margin="309,58,0,0" Name="btnSubmit" VerticalAlignment="Top" Width="75">
<Button.Content> Submit</Button.Content >
</Button

______________________________________________________________________________________________
常用控件
常用属性:

//Visibility的值控制控件的显示: Collapsed隐藏, Visible可见

ReadOnly只读属性

TextWrapping="Wrap"可以折行,自动换行

IsEnable: 控件是否可用: bool类型

Background背景"色", FontSize字体大小

MaxLength: 最大长度

PasswordBox: 密码框的取值使用Password属性值,而不是Text

Margin="15"
距离周边的距离

______________________________________________________________________________________________
可空数据类型: 引用类型, 自定义,string, 大部分类都是
不可空:值类型. int,boolean,decimal, DataTime
##在不可为null的类型后加?就可以为null了

int? i1 = null; //这是可以的,就因为这个?, 一旦加上?就相当于引用类型(个人理解)
int i2 = 6;
int? i3 = i2; //这也是可以的,把int赋值给int?
int i4 = (int)i3; //这也是可以的,强制转换

______________________________________________________________________________________________
一些控件

RadioButton, GroupName是组名

DatePicker 选择时间控件,属性值可空

Image控件, Source地址

ProgressBar, 进度条: IsIndeterminate是否不确定模式: Maximun最大值, Minimum最小值

DateTime.Today 不包含小时,分,秒
DateTime.Now 包含
______________________________________________________________________________________________
页面布局

绝对定位,使用具体数值定位

StackPanel, 进行布局, Orientation垂直布局,还是水平布局, 可以嵌套

Margin对顶点,参数,, VerticalAlignment="Center"垂直居中

Button btn = new Button(); btn.Content="动态控件"; stackPanel1.Children.Add(btn);

例子:

<StackPanel Orientation ="Horizontal">
<Button Margin ="0,0,200,200">
<Button.Content>
<StackPanel Orientation ="Horizontal">
<Image Width ="50" Height="50" Source="/img/Chrysanthemum.jpg"></Image>
<TextBlock VerticalAlignment ="Center" Text="确定"></ TextBlock>
</StackPanel>
</Button.Content>
</Button>
</StackPanel>

[align=left]例子2:[/align]

<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width ="50"></ColumnDefinition>
<ColumnDefinition></ ColumnDefinition>
<ColumnDefinition></ ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height ="50"></RowDefinition>
<RowDefinition></ RowDefinition>
<RowDefinition></ RowDefinition>
<RowDefinition></ RowDefinition>
</Grid.RowDefinitions>
<Button Grid.Row ="1" Grid.Column="1" Content="yiyi"></Button >
<TextBlock Grid.Row ="0" Grid.Column="2" Text="123" Background ="Red"></TextBlock>
<Image Source ="/img/Chrysanthemum.jpg" Grid.Row="3" Grid.ColumnSpan ="2"></Image>
</Grid>

[align=left]例子:登陆[/align]

<Grid>
<Grid>
<Grid.RowDefinitions>
<RowDefinition></ RowDefinition>
<RowDefinition></ RowDefinition>
<RowDefinition></ RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition></ ColumnDefinition>
<ColumnDefinition></ ColumnDefinition>
</Grid.ColumnDefinitions>
<TextBlock Text ="用户名:" HorizontalAlignment="Center" VerticalAlignment ="Center" Grid.Column="0" Grid.Row="0"></TextBlock >
<TextBox Margin ="15" Grid.Row="0" Grid.Column="1" ></TextBox >
<TextBlock Text ="密码:" HorizontalAlignment="Center" VerticalAlignment="Center" Grid.Column="0" Grid.Row="1"></TextBlock >
<PasswordBox Margin ="15" Grid.Row="1" Grid.Column="1"></PasswordBox >
<Button Margin ="10" Grid.Row="2" Content="登陆"></Button>
<Button Margin ="10" Grid.Column="1" Grid.Row="2" Content ="取消"></ Button>
</Grid>
</Grid>

______________________________________________________________________________________________
连连看棋盘:

private void Window_Loaded(object sender, RoutedEventArgs e)
{
for (int i = 0; i < 10; i++)
{ //动态创建十行十列
RowDefinition rdRow = new RowDefinition();
gridGame.RowDefinitions.Add(rdRow);
ColumnDefinition cdCol = new ColumnDefinition();
gridGame.ColumnDefinitions.Add(cdCol);
}
Random random = new Random();
//random.Next(0, 10); //生成<=0, <9的随机整数
for (int i = 0; i < 10; i++)
{
for (int j = 0; j < 10; j++)
{
//Button btn = new Button();
//btn.Content = i + "," + j;
//Grid.SetRow(btn, i);//设置控件的行属性用Grid的静态方法
//Grid.SetColumn(btn, j);
//gridGame.Children.Add(btn);
string imgName = "/img/" + random.Next(1,10) + ".jpg";
Image img = new Image();
img.Source =  new BitmapImage (new Uri(imgName, UriKind .Relative));
Grid.SetColumn(img, j);
Grid.SetRow(img, i);
gridGame.Children.Add(img);
}
}
}

嵌套的布局:

<Grid>
<Grid>
<Grid.RowDefinitions>
<RowDefinition></ RowDefinition>
<RowDefinition></ RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition></ ColumnDefinition>
<ColumnDefinition></ ColumnDefinition>
</Grid.ColumnDefinitions>
<Button Grid.Row ="1" Grid.Column="1" Content="123" Margin ="20"></Button>
<StackPanel>
<Button Content ="1"></Button>
<Button Content ="2"></Button>
<Button Content ="3"></Button>
</StackPanel>
<Grid Grid.Row ="0" Grid.Column="1">
<Grid.RowDefinitions>
<RowDefinition></ RowDefinition>
<RowDefinition></ RowDefinition>
<RowDefinition></ RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition></ ColumnDefinition>
<ColumnDefinition></ ColumnDefinition>
<ColumnDefinition></ ColumnDefinition>
</Grid.ColumnDefinitions>
<Button Content ="Hello" Margin="10"></ Button> vr
</Grid>
</Grid>
</Grid>

______________________________________________________________________________________________
练习一: 计算器布局模拟

<Window x :Class="练习一计算器界面.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height ="320" Width="200">
<Grid>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height ="80"></RowDefinition>
<RowDefinition></ RowDefinition>
<RowDefinition></ RowDefinition>
<RowDefinition></ RowDefinition>
<RowDefinition></ RowDefinition>
<RowDefinition></ RowDefinition>
<RowDefinition></ RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition></ ColumnDefinition>
<ColumnDefinition></ ColumnDefinition>
<ColumnDefinition></ ColumnDefinition>
<ColumnDefinition></ ColumnDefinition>
<ColumnDefinition></ ColumnDefinition>
</Grid.ColumnDefinitions>
<Border Grid.ColumnSpan ="5" BorderThickness="1" BorderBrush="Gray" Margin ="2">
<TextBlock Text ="0" Grid.ColumnSpan="5" HorizontalAlignment="Right" VerticalAlignment="Center" FontSize="24" ></TextBlock >
</Border>
<Button Content ="MC" Margin="2" Grid.Row="1"></Button >
<Button Content ="<-" Margin="2" Grid.Row="2"></Button >
<Button Content ="7" Margin="2" Grid.Row="3"></Button >
<Button Content ="4" Margin="2" Grid.Row="4"></Button >
<Button Content ="1" Margin="2" Grid.Row="5"></Button >
<Button Content ="1" Margin="2" Grid.Row="5"></Button >
<Button Content ="0" Margin="2" Grid.Row="6" Grid.ColumnSpan ="2"></Button>
<Button Content ="MR" Margin="2" Grid.Row="1" Grid.Column ="1"></Button>
<Button Content ="CE" Margin="2" Grid.Row="2" Grid.Column ="1"></Button>
<Button Content ="8" Margin="2" Grid.Row="3" Grid.Column ="1"></Button>
<Button Content ="5" Margin="2" Grid.Row="4" Grid.Column ="1"></Button>
<Button Content ="2" Margin="2" Grid.Row="5" Grid.Column ="1"></Button>
<Button Content ="MS" Margin="2" Grid.Row="1" Grid.Column ="2"></Button>
<Button Content ="C" Margin="2" Grid.Row="2" Grid.Column ="2"></Button>
<Button Content ="9" Margin="2" Grid.Row="3" Grid.Column ="2"></Button>
<Button Content ="6" Margin="2" Grid.Row="4" Grid.Column ="2"></Button>
<Button Content ="3" Margin="2" Grid.Row="5" Grid.Column ="2"></Button>
<Button Content ="." Margin="2" Grid.Row="6" Grid.Column ="2"></Button>
<Button Content ="M+" Margin="2" Grid.Row="1" Grid.Column ="3"></Button>
<Button Content ="±" Margin="2" Grid.Row="2" Grid.Column ="3"></Button>
<Button Content ="/" Margin="2" Grid.Row="3" Grid.Column ="3"></Button>
<Button Content ="*" Margin="2" Grid.Row="4" Grid.Column ="3"></Button>
<Button Content ="-" Margin="2" Grid.Row="5" Grid.Column ="3"></Button>
<Button Content ="+" Margin="2" Grid.Row="6" Grid.Column ="3"></Button>
<Button Content ="M-" Margin="2" Grid.Row="1" Grid.Column ="4"></Button>
<Button Content ="√" Margin="2" Grid.Row="2" Grid.Column ="4"></Button>
<Button Content ="%" Margin="2" Grid.Row="3" Grid.Column ="4"></Button>
<Button Content ="1/x" Margin="2" Grid.Row="4" Grid.Column ="4"></Button>
<Button Content ="=" Margin="2" Grid.Row="5" Grid.RowSpan ="2" Grid.Column="4"></ Button>
</Grid>
</Grid>
</Window>

[align=left] [/align]
______________________________________________________________________________________________
练习二: 腾讯微博界面简单模拟

<Window x :Class="腾讯微博界面模拟.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height ="350" Width="525">
<Grid>
<Grid>
<Grid.RowDefinitions>
<RowDefinition></ RowDefinition>
<RowDefinition></ RowDefinition>
<RowDefinition></ RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition></ ColumnDefinition>
<ColumnDefinition></ ColumnDefinition>
<ColumnDefinition></ ColumnDefinition>
<ColumnDefinition></ ColumnDefinition>
</Grid.ColumnDefinitions>
<Image Source ="/Images/Back.jpg" HorizontalAlignment="Right" Margin="15"></Image >
<TextBlock Text ="个人资料" Grid.Column="1" VerticalAlignment ="Center" FontSize="28" Foreground="White"></ TextBlock>
<Image Source ="/Images/Head.jpg" Grid.Row="1" Grid.Column="1" HorizontalAlignment="Left"></ Image>
<Grid Grid.Row ="1" Grid.Column="2" >
<Grid.RowDefinitions>
<RowDefinition></ RowDefinition>
<RowDefinition></ RowDefinition>
<RowDefinition></ RowDefinition>
</Grid.RowDefinitions>
<Button Grid.Row ="2">
<Button.Content>
<Image Source ="/Images/Listen.jpg"></ Image>
</Button.Content>
</Button>
<StackPanel Grid.Row ="1" Orientation="Horizontal">
<Image Source ="/Images/Listened.jpg"></ Image>
<TextBlock Text ="Ta已收听你" FontSize="16" VerticalAlignment ="Center"></TextBlock>
</StackPanel>
</Grid>
<Grid Grid.Row ="2" Grid.Column="1" Grid.ColumnSpan="2" Background ="White" Margin="5">
<Grid.RowDefinitions>
<RowDefinition></ RowDefinition>
<RowDefinition></ RowDefinition>
</Grid.RowDefinitions>
<StackPanel Grid.Row ="0">
<TextBlock Text ="张耕明" FontSize="18"></TextBlock >
<TextBlock Text ="@zgmzhang" FontSize="18"></ TextBlock>
</StackPanel>
<StackPanel Grid.Row ="1">
<TextBlock Text ="个人介绍" FontSize="18"></TextBlock >
<TextBlock Text ="还没想好写什么..." FontSize="18"></TextBlock >
</StackPanel>
</Grid>
<Grid.Background>
<LinearGradientBrush EndPoint ="1,0.5" StartPoint="0,0.5">
<GradientStop Color ="White" Offset="1" />
<GradientStop Color ="#FF5996C3" Offset="0" />
</LinearGradientBrush>
</Grid.Background>
</Grid>
</Grid>
</Window>

[align=left] [/align]

______________________________________________________________________________________________
菜单

普通菜单(主菜单)-Menu, 上下文菜单(右键菜单)-ToolBar两种

DockPanel 先到先得空间

______________________________________________________________________________________________
窗口

标题用Window的Title属性

不想能够修改大小: ResizeMode = "NoResize"

窗口打开正中央 WindowStartupLocation = "CenterScreen"

窗口间传递参数, 在被传类中新建一个属性值, 在传类中直接给属性赋值

传递的值主要都是通过属性来实现

App.xaml中可以修改启动窗口

窗口练习1:

<Window x :Class="菜单栏.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height ="350" Width="525">
<Grid>
<DockPanel>
<Menu Height ="30" HorizontalAlignment="Left" DockPanel.Dock="Top">
<MenuItem Header ="文件">
<MenuItem Header ="打开">
<MenuItem Header ="1.text"></MenuItem>
<MenuItem Header ="2.text"></MenuItem>
</MenuItem>
</MenuItem>
<MenuItem Header ="删除"></ MenuItem>
<MenuItem Header ="复制"></ MenuItem>
<MenuItem Header ="查找"></ MenuItem>
<MenuItem Header ="新建"></ MenuItem>
</Menu>
<ToolBar DockPanel.Dock ="Top">
<Button Content ="打开"></ Button>
<Button Content ="走了" Name="btnClose" Click="btnClose_Click"></Button>
<TextBox Width ="80" Name="txtUserName"></ TextBox>
<Button Content ="查找"></ Button>
<CheckBox Content ="置顶"></ CheckBox>
</ToolBar>
<TextBox DockPanel.Dock ="Bottom" Name="txtMessage"></ TextBox>
</DockPanel>
</Grid>
</Window>

namespace MenuFrm
{
/// <summary>
/// MainWindow.xaml 的交互逻辑
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
private void btnClose_Click(object sender, RoutedEventArgs e)
{
AbortWindow aw = new AbortWindow();
aw.UserName = txtUserName.Text;
aw.ShowDialog();
txtMessage.Text = "走成功了吗?--" + aw.Chose;
}
}
}

<Window x :Class="菜单栏.AbortWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml"
Title="是否真的要走吗?" Height="121" Width="358" ResizeMode ="NoResize" WindowStartupLocation="CenterScreen" Loaded="Window_Loaded">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width ="102*" />
<ColumnDefinition Width ="234*" />
</Grid.ColumnDefinitions>
<TextBlock Height ="23" HorizontalAlignment="Left" Margin="12,12,0,0" Name ="txtUserName" Text="***" VerticalAlignment="Top" Grid.ColumnSpan ="2" Width="301" />
<Button Content ="是" Height="23" HorizontalAlignment="Left" Margin ="55,46,0,0" Name="btnYes" VerticalAlignment="Top" Width="75" Click ="btnYes_Click" Grid.ColumnSpan="2" />
<Button Content ="否" Height="23" HorizontalAlignment="Left" Margin ="79,46,0,0" Name="btnNo" VerticalAlignment="Top" Width="75" Click ="btnNo_Click" Grid.Column="1" />
</Grid>
</Window>

namespace MenuFrm
{
/// <summary>
/// AbortWindow.xaml 的交互逻辑
/// </summary>
public partial class AbortWindow : Window
{
public string UserName { get; set; }
public string Chose { get; set; }
public AbortWindow()
{
InitializeComponent();
}
private void Window_Loaded(object sender, RoutedEventArgs e)
{
txtUserName.Text = UserName + ",您真地要走吗?" ;
}
private void btnYes_Click(object sender, RoutedEventArgs e)
{
Chose = "Yes";
this.Close();
}
private void btnNo_Click(object sender, RoutedEventArgs e)
{
Chose = "No";
this.Close();
}
}
}

______________________________________________________________________________________________
打开文件, 和保存文件

private void btnOpenFile_Click( object sender, RoutedEventArgs e)
{
OpenFileDialog ofd = new OpenFileDialog();
ofd.Filter = "文本文件|*.txt|图片|*.png|视频|*.avi|所有文件|*.*" ;
if (ofd.ShowDialog() == true )
{
MessageBox .Show("选择成功!" + ofd.FileName.ToString());
}
else
{
MessageBox .Show("选择失败!" );
}

}
private void btnSaveFile_Click( object sender, RoutedEventArgs e)
{
SaveFileDialog sfd = new SaveFileDialog();
sfd.Filter = "文本|*.txt|word文件|*.doc" ;
if (sfd.ShowDialog() == true )
{
MessageBox .Show(sfd.FileName.ToString());
}

}

图片打开和显示
OpenFileDialog ofd = new OpenFileDialog();
ofd.Filter = "png图??片?|*.png|所??有?D文?件t|*.*" ;
if (ofd.ShowDialog() == true )
{
string fileName = ofd.FileName;
imgShow.Source = new BitmapImage ( new Uri (fileName));
}

________________

______________________________________________________________________________