zoukankan      html  css  js  c++  java
  • vs2010 学习Silverlight学习笔记(8):使用用户控件

    概要:

      这个类似于封装控件样式。不过封装的是整个或是多个控件罢了,然后用的时候就可以直接引用过来了。

    创建用户控:

      这个也很简单,不过有几个地方需要注意下。这个就不照抄了,咱们也自己写一个。
      步骤:
      1.在SilverlightApplication中添加SilverlightUserControl。
      2.发现新建的是:
      
       打开看一下,这个文件跟MainPage一样一样的。但是你不能把它当做MainPage用,如果你想用的话,你要到App.xaml
      中修改启动
      
    private void Application_Startup(object sender, StartupEventArgs e)
    {
    this.RootVisual = new MainPage();
    }






    3.在SilverlightControl1.xaml中添加代码


    代码


    <Grid x:Name="LayoutRoot" Background="#46461F">
    <Grid.RowDefinitions>
    <RowDefinition></RowDefinition>
    <RowDefinition></RowDefinition>
    <RowDefinition></RowDefinition>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
    <ColumnDefinition></ColumnDefinition>
    <ColumnDefinition></ColumnDefinition>
    </Grid.ColumnDefinitions>
    <TextBlock Grid.Row="0" Grid.Column="0" Text="账户"
    Width
    ="50" Height="20"></TextBlock>
    <TextBox Grid.Row="0" Grid.Column="1" Width="200" Height="20"></TextBox>
    <TextBlock Grid.Row="1" Grid.Column="0" Text="密码"
    Width
    ="50" Height="20"></TextBlock>
    <TextBox Grid.Row="1" Grid.Column="1" Width="200" Height="20"></TextBox>
    <Button Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="2" Content="提交"
    Background
    ="Orange" Width="200" Height="100"></Button>
    </Grid>


    4.在MainPage.xaml添加代码


    代码


    <UserControl x:Class="SilverlightAppDemo10.MainPage"
    xmlns:myControl
    ="clr-namespace:SilverlightAppDemo10"
    xmlns
    ="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x
    ="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d
    ="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc
    ="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable
    ="d"
    d:DesignHeight
    ="300" d:DesignWidth="400">

    <Grid x:Name="LayoutRoot" Background="White">
    <myControl:SilverlightControl1 x:Name="mycon"></myControl:SilverlightControl1>
    </Grid>
    </UserControl>





    主要就是:
        注册:xmlns:myControl="clr-namespace:SilverlightAppDemo10"      
        使用或引用:<myControl:SilverlightControl1 x:Name="mycon"></myControl:SilverlightControl1>
        这些代码vs会出现输入提示的。。。
      5.看看效果。我晕,还真难看。。。
        

    添加用户控件属性:

    哎,本想show一下asp.net控件开发知识的。结果没成功,把代码贴上了。我会继续研究原因的,也请知道的朋友告诉我一下。
    SilverlightControl.xaml代码:
    代码
    <Canvas x:Name="LayoutRoot" Background="White">
    <TextBlock x:Name="txtb" Canvas.Left="20" Canvas.Top="50" Width="100" Height="20" Text=""></TextBlock>
    <TextBox Canvas.Left="150" Canvas.Top="50" Width="200" Height="20"></TextBox>
    </Canvas>



    SilverlightControl.xaml.cs代码:

    代码
    public string TextMessage
    {
    get
    {
    return this.txtb.Text!=""?this.txtb.Text:"还没有定义属性";
    }
    set
    {
    this.txtb.Text = value;
    }
    }


    MainPage.xaml代码:




    <Grid x:Name="LayoutRoot" Background="White">
    <myControl:SilverlightControl1 x:Name="myCon" TextMessage="没成功啊"></myControl:SilverlightControl1>
    </Grid>





    运行一下:

    我想的是,假如没有设置Text,就会显示:还没有定义属性 ,设置后就会显示设置的属性。可是这个Silverlight机制我不太懂,
    弄巧成拙了。

    动态添加用户控件:

      时间不够了,先把TerryLee的贴上。回头我再改。另外我在想既然可以动态添加,是不是也可以动态减去?
    这样的话,页面岂不是花样百出了?!我会明天继续。。
    1.用户控件可以动态的添加到页面中,修改一下Page.xaml中的XAML代码,放入一个Canvas作为用户控件的容器。
    <Grid x:Name="LayoutRoot" Background="#46461F">
        <Canvas x:Name="ContainerCanvas">
           
        </Canvas>
    </Grid>
     编写添加用户控件代码:
    private void LayoutRoot_Loaded(object sender, RoutedEventArgs e)
    {
        ConfirmBox confirmbox = new ConfirmBox();

        confirmbox.Message = "动态添加用户控件成功!";

        ContainerCanvas.Children.Add(confirmbox);
    }

    后记:

      现在有两个问题:
      1.动态修改用户控件属性,即上面那个代码中get{}set{}为什么不能成功?怎样才能成功?
      2.能否动态卸载控件?
    这篇是我昨晚写的,不过关机的时候忘记保存了。。今天重做一下,传了上来。
    今天是我生日,我出去玩了。晚上回来我会继续研究者两个问题。
    总目录
    上一篇:vs2010 学习Silverlight学习笔记(7):控件样式与模板
    下一篇:vs2010 学习Silverlight学习笔记(9):使用用户控件(2)
  • 相关阅读:
    Big Event in HDU
    ACM STEPS——Chapter Two——Section One
    黑马day15 文件上传&amp;apche的工具包
    阿里云部署Docker(8)----安装和使用redmine
    【React Native开发】React Native控件之ProgressBarAndroid进度条解说(12)
    python抓取新浪微博评论并分析
    使用Xcode-debug模式和release模式
    hdu 5417 Victor and Machine
    《Head First 设计模式》学习笔记——适配器模式 + 外观模式
    设计模式(二)
  • 原文地址:https://www.cnblogs.com/yaoge/p/1731739.html
Copyright © 2011-2022 走看看