WP7基础学习---

最新推荐文章于 2022-03-29 22:30:40 发布

肆意年华

最新推荐文章于 2022-03-29 22:30:40 发布

阅读量751

点赞数

分类专栏： WP7 文章标签： radiobutton image datatemplate binding button border

WP7 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

WP7--2

页面\Application Bar\系统资源\IsolatedStorage\Splashscreen and Applictopn Tile\ScreenShot

1.页面
(1).PhoneApplicationFrame:
一个程序中只能有一个Frame；是所有页面的容器；为SystemTray和ApplicationBar预留空间
(2).PhoneApplicationPage:
显示各自页面的ApplicationBar；放置页面内容的容器
(3).方向：
Orientation="Portrait";
this.Orientation=PageOrientation.Portrait;
(4).转向
SupportedOrientations="Portrait";
this.SupportedOrientations=
SupportedPageOrientation.PortraitOrLandscape;
this.OrientationChanged+=new EventHandler<OrientationChangedEventArgs>(MainPage_OrientationChanged);
(5).this.NavigationService.Navigate(new Uri("/Page1.xaml",UriKind.Relative));
this.NavigationService.GoBack();
this.NavigationService.GoForward();
(6).传值(对于传值，可在下一个页面的Loaded事件接受)
this.NavigationService.Navigate(new Uri("/Page1.xaml?name=aa",UriKind.Relative));
(7).接受
if(this.NavigationContext.QueryString.ContainaKey("name"))
this.PageTitle.Text=this.NavigationContext.QueryString["name"];
2.ApplicationBar:
ApplicationBarIconButton
<shell:ApplicationBarIconButton IconUri="/Assets/appbar.add.rest.png" Text="增加" Click="ApplicationBarIconButton_Click"/>
图标：48*48像素png图，前景色一般为白色

MenuItems(无二级菜单)
<shell:ApplictionBarMenuItem Text="MenuItem1" Click="ApplicationBarMenuItem_Click"/>

注意：
ApplicationBarIconButton最多只能加4个；
Icon 图片属性：Build Action:Content
Copy to Output Directory:Copy if newer\Copy Always

5.系统资源的使用
6.IslatedStorage的读写操作

WP7--3
本节课程:对于常用容器和控件的练习

对于通用属性（UIElement）
1.Height/Width:用户设置的控件的大小，是预期的大小
2.ActualHeight/ActualWidth:获取控件的实际大小
3.MaxHeight/MaxWidth&MinHeight/MinWidth:设置空间的大小的三个属性（还有Height/Width）中的两个。如果三个值发生冲突，首先要保证的是Min然后是Max,但是这两个值一定要在Height/Width设置值之间才有效
4.Cursor:设置、获取控制光标形状
5.DataContext:设置、获取控件数据内容
6.HorizontalAlignment/VerticalAlignment:设置/获取控件水平/垂直方向的对齐方式
7.Language:设置/获取localization/globalization语言信息，如Language="en-US"
8.Margin:设置/获取控件与页面的边距
9.Name:设置/获取空间的名称
10.Parent:获取空间的父对象
11.Resources:设置/获取控件资源字典，使资源像样式一样通过引用资源串名，在XAML中使用。资源可以是任何数据类型
12.Style:设置/获取控件的外观样式，也可以先定义好后，绑定到多个控件上
13.Tag:维空间加标签说明
14.CacheMode:设置、获取一个值，该值指示应在可能时高速缓存已呈现的内容（一般用在大的内容上，如：播放媒体，加载大图片）
15.DesiredSize:获取系统布局的大小，对于布局的调整很有用
16.Opacity:设置/获取控件的透明度
17.UseLayoutRounding:设置/获取控件及其子控件是否按子像素进行布局，使控件外观圆滑清晰
18.Visibility：设置/获取控件是否可见
19.Background:设置/获取控件背景效果
20.Foreground:设置/获取字体颜色
21.RenderTransformOrigin:设置/获取变形的起始点
22.BorderBrush:设置/获取控件边框效果
23.BorderThickness:设置/获取控件边框粗细
24.FontFamily:设置/获取字体
25.FontSize:设置/获取字体大小
26.FontStretch:设置/获取字体字形
27.FontStyle:设置/获取字体样式
28.FontWeight:获取/设置字体粗细
29.IsEnable:设置/获取控件是否可用。
   如果为false,控件无法获取焦点，不能输入
30.IsTabStop:设置/获取控件是否加入TabNavigation.
   如果为false,控件无法获取焦点。
31.Padding:设置/获取控件与容器的边距
32.TabIndex:设置/获取控件获取焦点的顺序
33.TabNavigation:设置、获取控件焦点顺序按什么方式轮转
34.Template:设置/货物控件的模板
35.IsHitTestVisible:设置/获取控件是否接受输入事件，
   如mouse事件等；如果为false,无法获得焦点
36.HorizontalContentsAligment/VerticalContentAlignment:
   设置/获取控件内容的对齐方式

##########################################################
1.Clip:设置、获取空间剪裁效果（圆角效果）
<Image Grid.Row="1" Height="213" HorizontalAlignment="Left" Margin="126,93,0,0" Name="image2" Stretch="Fill" VerticalAlignment="Top"
Width="200" Source="Hydrangeas.jpg" Tag="Hydrangeas">
<Image.Clip>
<RectangleGeometry Rect="100,100,100,100" RadiusX="20" RadiusY="20"/>
</Image.Clip>
</Image>

2.OpacityMask设置、获取一个控件蒙板，来产生蒙板透明效果
<Image.OpacityMask>
<RadialGradientBrush>
<GradientStop Color="#0C000000" Offset="1"/>
<GradientStop Color="White" Offset="0.3"/>
</RadialGradientBrush>
</Image.OpacityMask>

3.Projection:设置、获取控件3-D透视效果
<Image.Projection>
<PlaneProjection LocalOffsetX="-3" RotationX="49" RotationY="47" RotationZ="34" CenterOfRotationX="0"
CenterOfRotationZ="-2.3" GlobalOffsetX="63" GlobalOffsetY="21" GlobOffsetZ="40"/>
</Image.Projection>

4.RenderTransform:设置、获取空间变形效果
<Image.RenderTransform>
<RotateTransform CenterX="100" CenterY="200" Angle="60"/>
</Image.RenderTransform>

<ImageGrid.Row="1" Height="213" HorizontalAlignment="Left" Margin="129,257,0,0" Name="image2" Stretch="Fill" VerticalAlignment="Top"
Width="200" RenderTransformOrigin="0,0" Source="Hydrangeas.jpg"/>

---------------------------容器---------------------------
容器：Grid\Canvas\StackPanel\Border\PopUp\ScrollView

5.Grid:网格
<Grid x:Name="ContentGrid" Grid.Row="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="159"/>
<ColumnDefinition Width="141"/>
<ColumnDefinition Width="180"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="134"/>
<RowDefinition Height="133"/>
<RowDefinition Height="220"/>
<RowDefinition Height="162"/>
</Grid.RowDefinitions>
<Image Height="110" Margin="20,16,0,0" Width="131" Stretch="Fill" Source="Chrysanthemum.jpg"/>
<Image Grid.Column="1" Grid.Row="1" Height="105" Stretch="Fill" Margin="13,12,0,0" Width="115" Source="Desert.jpg"/>
<Image Grid.Column="2" Grid.Row="2" Height="150" Stretch="Fill" Margin="14,51,0,0" Width="154"
Source="Hydrangeas.jpg"/>
</Grid>

6.Canvas：用绝对坐标来定位子控件（层叠）
<Canvas Grid.Row="1">
<Image Source="Chrysanthemum.jpg" Stretch="Fill" Canvas.Left="79" Canvas.Top="93" Canvas.ZIndex="2" Width="206" Height="96"/>
<Image Source="Desert.jpg" Stretch="Fill" Canvas.Left="134" Canvas.Top="121" Canvas.ZIdex="1" Width="224" Height="120"/>
</Canvas>

cs代码：在页面Load事件去写
{
Canvas.SetLeft(image1，300);//动态控制放在Canvas的控件
}

7.StackPanle:设置自空间的排列方向
<StackPanle Orientation="Horizontal">
<Image Source="Chrysanthemum.jpg" Height="200" Width="200"/>
<StackPanel Orientation="Vertial">
<TextBlock Text="Test1" FontSize="30"/>
<TextBlock Text="Test2" FontSize="30"/>
</StackPanel>
</StackPanel>

8.Border:给包容的子控件加边框
<Border Width="200" Height="200" BorderBrush="Aquamarine" BorderThickness="10" Margin="150,103,130,346"/>
<Border Width="200" Heght="200" BorderBrush="Aquamarine" BorderThrickness="10,5,20,40"
Margin="150,369,130,80" CornerRadius="25,200,10,15">
<TextBox Height="67" Text="Test Border" Background="Gold" Foregroung="White" Width="170" VerticalAlignment="Bottom"/>
</Border>

9.PopUp:这个容器可以被打开和关闭(关闭不能看到里面内容)
<Popup HorizontalAlignment="Left" Margin="109,172,0,0" Name="popup1" VerticalAlignment="Top" Height="250" Width="250" IsOpen="True">
<Canvas Width="250" Height="250" Background="Red" VerticalAlignment="Center" HorizontalAlignment="Center">
<TextBlock Margin="90,120,0,0" Text="请等待。。。"/>
</Canvas>
</Popup>

10.ScrollView:拖动显示其所包含的控件的内容（ScrollBar）
<ScrollViewer Height="293" Margin="75,112,0,0" Name="ScollViewer1" VerticalAlignment="Top" Width="279" HorizontalScrollBarVisibility="Auto" VerticalScrollBarbility="Auto">
<Image Source="Hydrangeas.jpg" Height="779" Width="1036" />(图片控件的大小等于大图片的大小)
</ScrollViewer>

----------------------按钮--------------------------------
11.Button(也可直接设置它的背景颜色)
<Button Content="Button" Height="72" HorizontalAlignment="Left" Margin="124,242,0,0" Name="button1" VerticalAlignment="Top" Width="160"
<Button.Background>
<ImageBrush ImageSource="Desert.jpg"/.
<Button.Background>
</Button>

12.HyperlinkButton:超链接按钮，用于本地、Web
<HyperlinkButton Content="HyperlinkButton" Height="61"
HorizontalAligment="Left" Margin="96,99,0,0" Name="hyperlinkButton1" VerticalAlignment="Top" Width="220" NavigateUri=http://baidu.com
TargetName="_self"/>此处是必须的
<HyperlinkButton Content="Navigate" Height="50" HorizontalAlignment="Left" Margin="96,265,0,0"
Name="hyperlinkButton2" VerticalAlignment="Top"
Width="204" NavigateUri="/Page1.xaml">相对地址不需的
<HyperlinkButton.Backgrond>
<ImageBrush ImageSource="Desert.jpg"/>
</HyperlinkButton.Backgroung>
</HyperlinkButton>

13.RepeatButton:在按下后，不断的发生Click事件
(可以操作，按住按钮时，实现计数功能！)
<RepeatButton Content="Test RepeatButton" Height="94" HorizontalAlignment="Left" Margin="79,80,0,0" Name="repeatButton1" VerticalAlignment="Top" Width="292"/>
<RepeatButton Content="Test" Height="106" HorizontalAlignment="Left" Margin="79,239,0,0" Name="repeatButton2" VerticalAlignment="Top" Width="236" Click="repeatBU=utton2_Click">
<RepeatButton.Background>
<ImageBrush IamgeSource="Desert.jpg"/>
</RepeatButton.Background>
<RepeatButton>

14.ToggleButton:关闭按钮，三种状态Checked,UnChecked,Indeterminate

WP7--4
本节课程：输入控件、基本控件、多媒体控件
输入控件:｛PasswordBox/TextBox｝
1.PasswordBox:用于输入自定义的遮罩字符的输入控件
<PasswordBox Height="72" HorizontalAlignment="Left" Margin="12,119,0,0" Name="passwordBox1" VerticalAlignment="Top" Width="460"/>
<PasswordBox Height="72" HorizontalAlignment="Left" Margin="12,284,0,0" Name="passwordBox2" Width="460" VerticalAlignment="Top" PasswordChar="$"/>
<PasswordBox Height="72" HorizontalAlignment="Left"
Margin="12,454,0,0" Name="passwordBox3" VerticalAlignment="Top" Width="460" PasswordChar="@"/>

2.TextBox:可以让软键盘产生不同的键面效果
InputScope属性：通过代码获取属性列表
--typeof(InputScopeNameValue).GetFields (BindingFlags.Public|BindingFlags.Static);--
典型的软键盘设置
-Text：增加了联想输入
-TelephoneNumber:键面全部为数字显示
-Url:键面显示.com
<TextBox>
<TextBox.InputScope>
<InputScope>
<InputScopeName NameValue="Number"/>
</InputScope>
</TextBox.InputScope>
</TextBox>

也可用代码编辑，在页面Load事件写入
FileIdInfo []array=typeof(InputScopeNameValue).GetFiles(BindingFlags.Public|BindingFlags.Static);
获取60多种软键盘的设置

多媒体控件：｛Image/MediaElement｝
1.Image:只支持png/jpg格式图像；显示本地或网络图像(注意图片属性的修改，Content|Copy if new)
<Image Source="Desert.jpg"/>
<Image Source=">
也可通过代码加载
this.image1.Source=new BitmapImage(new Uri("Desert.jpg",UriKind.Relative));
this.image1.Source=new BitmapImage(new Uri("http://www.daisy123.com/wpcontent/uploads/2010/11/42724650.jpg",UriKind.Absolute));

2.MediaElement

<MediaElement

对于事件：在Load事件中为mediaElement加一个播放失败的委托
代码：(加入大的视频，可能无法加载，报错！)
mediaElement1.MediaFailed+=new EventHandle();
在mediaElement1.MediaFaile事件中写入：
if(e.ErrorException!=null)
this.PageTitle.Text=e.ErrorException.ToString();

基本控件：｛TextBlock/CheckBox/RadioButton/PrgressBar/Slider/Thumb/ListBox｝
1.TextBlock:在页面上显示文字（如：PageTitle）
（属性：TextWraping:换行显示）
<TextBlock Height="84" Foreground="Red" FontSize="50" HorizontalAlignment="Left" Margin="80,66,0,0" Name="textBlock1" Text="Hello World" VerticalAlignment="Top" Width="281"/>
<TextBlock Height="176" HorizontalAlignment="Left" Margin="79,242,0,0" Name="textBlock2" FontSize="40"
Text="Hello Windows Phone7" TextWrapping="Wrap" VerticalAlignment="Top" Width="271" />

2.CheckBox:对于它的放大、缩小，设置ScaleX,ScaleY的值;
ScaleX>1放大；<1缩小
<CheckBox Content="CheckBox" Height="72" IsChecked="True"
HorizontalAlignment="Left" Margin="105,124,0,0" Name="checkBox1" VerticalAlignment="Top" Checked="Checked事件" UnChecked="UnChecked事件"/>
<CheckBox Content="CheckBox" Height="74" Foreground="Blue"
Background="Red" HorizontalAlignment="Left" Name="checkBox2"Margin="111,224,0,0" VerticalAlignment="Top" Width="177"
<CheckBox.RenderTransform>
<ScaleTransform ScaleX="0.8" ScaleY="0.8"/>
</CheckBox.RenderTransform>
</CheckBox>

3.RadioButton:当创建多个时，自动互斥;大小的改变，还是同上
<RadioButton Content="RadioButton" Height="72" HorizontalAlignment="Left" Margin="113,112,0,0" Name="radioButton1" VerticalAlignment="Top"/>
<RadioButton Content="RadioButton" Foreground="Bule" Background="Red" Height="72" HorizontalAlignment="Left" Margin="113,229,0,0" Name="radioButton2" VerticalAlignment="Top"/>

4.ProgressBar:两种类型：显示确切进度的；不断重复
特有属性：IsIndeterminate="True"(两种类型)
事件:ValueChanged="事件"（值不断改变时，做的操作）
<ProgressBar Height="71" HorizontalAlignment="Left" Margin="24,109,0,0" Name="progressBar1" VerticalAlignment="Top" Width="424" Value="80"/>
<ProgressBar Height="55" HorizontalAlignment="Left" Margin="36,273,0,0" Name="progressBar2" Width=412" VerticalAlignment="Top" IsIndeterminate="True"/>

5.Slider:可以设置水平、垂直方向（滑竿：如播放器的音量）
属性：Orientation：方向；Value:最大是10
事件:ValueChanged="事件"（值不断改变时，做的操作）
<Slider Height="90" HorizontalAlignment="Left" Margin="20,30,0,0" Name="slider1" VerticalAlignment="Top"
Width="460"/>
<Slider Height="390" HorizontalAlignment="Left" Margin="192,166,0,0" Name="slider2" Width="59" VerticalAlignment="Top" Orientation=Vertical"/>
事件代码：
this.PageTitle.Text=e.NewValue.ToString();

6.Thumb:通过拖动，获取连续的坐标(像记事本)
三个事件：DragStarted:当鼠标点击，触发，执行操作； DragDelta:当鼠标在控件内滑动，触发，执行操作； DragCompleted：当鼠标离开，触发，执行操作
（本测试：点击：Started；离开:Compeleted；滑动：显示坐标）
<Thumb Height="125" HorizontalAlignment="Left" Margin="154,99,0,0" Name="thumb1" VerticalAlignment="Top" Width="190" DragStarted="thumb1_DragStarted" DragDelta="thumb1_DragDelta" DragCompleted="thumb1_DragCompleted"/>
事件代码：
DragCompleted:this.PageTitle.Text="Completed";
DragStarted: this.PageTitle.Text="Started";
DragDelta:(对于水平、垂直显示)
this.PageTile.Text=string.Format("x={0};y={1}",
e.HorizontalChange,e.VerticalChange);

7.ListBox:相当于一个容器，可以通过ListItem来组合多个控件而得到不同的功能的List
（属性：ItemTemplate有很多的Template，如：DataTemplate (数据绑定)）
<ListBox HorizontalAlignment="Left" Margin="10,6,0,0" Name="listBox1" VerticalAlignment="Top" Width="460">
<ListBox.ItemTemplate>
<DtatTemplate>
   <StackPanel Orientation="Horizontal">
    <Image Width="100" Height="100"
     Source="{Binding Source}"/>
    <TextBlock Text="{Binding Text}"/>
   </StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
(this.listBox1.ItemsSource=list;)

数据绑定：传值
(1)创建一个类:
public class Item
{
public ImageSource Source {get;set;}
public string Text {get;set;}
}
(2)在页面Load事件写入如下代码;
List<Item> list=new List<Item>();
Item item=new Item();
item.Source=new BitmapImage(new Uri("Chry.jpg",UriKind.relative));
item.Text="Chry.jpg";
list.Add(item);

item=new Item();
item.Source=new BitmapImage(new Uri("Desert.jpg",UriKind.relative));
item.Text="Desert.jpg";
list.Add(item);

item=new Item();
item.Source=new BitmapImage(new Uri("Ch.jpg",UriKind.relative));
item.Text="Ch.jpg";
list.Add(item);

listBox1.ItemsSource=list;

事件：listBox1.SelectionChange=new (事件)
在对应的事件中写入如下代码：
ListBox lb=sender as ListBox;
Item item=lb.SelectedItem as Item;
this.PageTitle.Text=item.Text;