레이아웃 - 캔버스 (Canvas) 사용하기

.NET프로그래밍/Silverlight 3.0 2009. 11. 24. 18:47 |



<Canvas> : 루트 레이아웃


- Silverlight의 최상위 레이아웃(1.0)
      - 실버라이트의 전체 영역을 지정
      - 직접 좌표값을 지정하는 방식



-------------------------------------------------------------------------------------

 

[MainPage.xaml]

<UserControl x:Class="RiaCanvas.MainPage"

    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">

    <!--<Canvas x:Name="redCanvas" Background="Red" Width="100" Height="100" Canvas.ZIndex="99">

        <Canvas x:Name="greenCanvas" Background="Green"

                Width="100" Height="100" Canvas.Left="20" Canvas.Top="20" Canvas.ZIndex="2">

            <Canvas x:Name="blueCanvas" Background="Blue" Width="100" Height="100" Canvas.ZIndex="0"

                    Canvas.Left="20" Canvas.Top="20">               

            </Canvas>

        </Canvas>

    </Canvas>-->

 

    <Canvas x:Name="redCanvas" Background="Red" Width="100" Height="100" Canvas.ZIndex="99">

        <Canvas x:Name="greenCanvas" Background="Green"

             Canvas.ZIndex="2"

                Width="100" Height="100" Canvas.Left="20" Canvas.Top="20">           

        </Canvas>

        <Canvas x:Name="blueCanvas" Background="Blue" Width="100" Height="100"

                Canvas.ZIndex="1"

                    Canvas.Left="40" Canvas.Top="40">           

        </Canvas>

    </Canvas>

</UserControl>

 

 


-------------------------------------------------------------------------------------

 


[실행결과]







저작자표시

'.NET프로그래밍 > Silverlight 3.0' 카테고리의 다른 글

레이아웃 - StackPanel 요소(컨트롤)  (0) 2009.11.24
레이아웃 - Grid 컨트롤  (0) 2009.11.24
XAML의 기본 제공 모양  (0) 2009.11.24
XAML(Extensible Application Markup Language)이란?  (0) 2009.11.24
Silverlight.js로 XAML 표시  (0) 2009.11.24
Posted by holland14
:

XAML의 기본 제공 모양

.NET프로그래밍/Silverlight 3.0 2009. 11. 24. 18:47 |

 

[MainPage.xaml]

<UserControl x:Class="RiaXAML.MainPage"

    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">

        <Button Content="클릭"  Foreground="Red" Height="23" HorizontalAlignment="Left" Margin="169,174,0,0" Name="button1" VerticalAlignment="Top" Width="75" Click="button1_Click" />

        <TextBlock Height="23" HorizontalAlignment="Left" Margin="140,85,0,0" Name="textBlock1" Text="" VerticalAlignment="Top" Width="120" />

    </Grid>

</UserControl>

 

 


-------------------------------------------------------------------------------------


 

[MainPage.xaml.cs]


using System;

using System.Collections.Generic;

using System.Linq;

using System.Net;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Documents;

using System.Windows.Input;

using System.Windows.Media;

using System.Windows.Media.Animation;

using System.Windows.Shapes;

 

namespace RiaXAML

{

    public partial class MainPage : UserControl

    {

        public MainPage()

        {

            InitializeComponent();

        }

 

        private void button1_Click(object sender, RoutedEventArgs e)

        {

            // XAML의 모든 요소들은 .NET 명령어로 접근 가능

            textBlock1.Width = 300;

            textBlock1.Height = 100;

            textBlock1.FontSize = 35;

            textBlock1.Foreground = new SolidColorBrush(Colors.Red);

 

            textBlock1.Text = DateTime.Now.ToShortTimeString();

        }

    }

}

 

 


-------------------------------------------------------------------------------------




[실행결과]













** 참고 **

--> 아래 그림과 같이 "새 항목 추가"로 "Silverlight User Control"형식인  "*.xaml파일"(여기서는 SubPage.xaml 임.)을 새로 추가할 수 있다.















 

저작자표시

'.NET프로그래밍 > Silverlight 3.0' 카테고리의 다른 글

레이아웃 - Grid 컨트롤  (0) 2009.11.24
레이아웃 - 캔버스 (Canvas) 사용하기  (0) 2009.11.24
XAML(Extensible Application Markup Language)이란?  (0) 2009.11.24
Silverlight.js로 XAML 표시  (0) 2009.11.24
<object /> 태그와 <embed />태그로 실버라이트 적용  (0) 2009.11.24
Posted by holland14
:

XAML(Extensible Application Markup Language)이란?

.NET프로그래밍/Silverlight 3.0 2009. 11. 24. 18:46 |

 

    XAML

     

  1. XAML(Extensible Application Markup Language)
    • 재물(XAML == Money?)
      • 잡(Xap == Jop?)
  2. XAML은 실버라이트에 비주얼한 UI를 구성하기 위한 명령어(태그)들을 말한다.
  3. XAML은 XML 문법을 따른다.
    • 웹 페이지가 HTML로 이루어진다면, 실버라이트는 XAML로 이루어진다.
  4. XAML 요소 = .NET 개체와 일대일로 매핑

저작자표시

'.NET프로그래밍 > Silverlight 3.0' 카테고리의 다른 글

레이아웃 - 캔버스 (Canvas) 사용하기  (0) 2009.11.24
XAML의 기본 제공 모양  (0) 2009.11.24
Silverlight.js로 XAML 표시  (0) 2009.11.24
<object /> 태그와 <embed />태그로 실버라이트 적용  (0) 2009.11.24
실버라이트 1.0 개발  (0) 2009.11.24
Posted by holland14
:

Silverlight.js로 XAML 표시

.NET프로그래밍/Silverlight 3.0 2009. 11. 24. 18:46 |



 Silverlight.js 파일

     

  1. Silverlight.js
    • 실버라이트 콘텐츠를 object 태그 또는 Embed 태그를 사용해서 웹 페이지에 보여줄 때, 브라우저에 따라 제대로 보여지지 않는 경우가 발생해서, 브라우저에 상관없이 동일하게 보여지도록 설정할 수 있는 기능 제공

     

  2. Visual Studio로 개발시 기본 템플릿으로 제공




-------------------------------------------------------------------------------------




[FrmSilverlight.xaml]



<Canvas xmlns="http://schemas.microsoft.com/client/2007"

        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

    <TextBlock

        x:Name="lblTitle"

        FontFamily="Malgun Gothic"

        FontSize="20"

        Text="안녕하세요. 반갑습니다."></TextBlock>

</Canvas>

 

 
-------------------------------------------------------------------------------------



--> 아래 그림의 솔루션 탐색기에서 "Silverlight.js"파일을 [FrmSilverlight.html]소스코드에 삽입하고 [FrmSilverlight.html]코드를 아래와 같이 수정한다.








[FrmSilverlight.html]



<html xmlns="http://www.w3.org/1999/xhtml">

<head>

        <title>RiaObjectAndEmbed</title>

 

        <script type="text/javascript" src="Silverlight.js"></script>

    <style type="text/css">

               #errorLocation {

                       font-size: small;

                       color: Gray;

               }

               #silverlightControlHost {

                       height: 480px;

                       width: 640px;

               }

 

        </style>

</head>

 

<body>

    <!-- Runtime errors from Silverlight will be displayed here.

        This will contain debugging information and should be removed or hidden when debugging is completed -->

        <div id='errorLocation'></div>

       

        <div id="silverlightPlugInHost">

               <script type="text/javascript">

                   if (!window.Silverlight)

                    window.Silverlight = {};

 

            Silverlight.createDelegate = function(instance, method) {

                    return function() {

                    return method.apply(instance, arguments);

                }

            }           

           

            Silverlight.createObjectEx({

                    source: 'FrmSilverlight.xaml',

                    parentElement: document.getElementById('silverlightPlugInHost'),

                    id: 'silverlightPlugIn',

                    properties: {

                           width: '100%',

                           height: '100%',

                           background:'white',

                           version: '1.0'

                    },

                    events: {

 

                    },        

                    context: null

            });

               </script>

        </div>

</body>

</html>





-------------------------------------------------------------------------------------



[실행결과]




 

 

 

저작자표시

'.NET프로그래밍 > Silverlight 3.0' 카테고리의 다른 글

XAML의 기본 제공 모양  (0) 2009.11.24
XAML(Extensible Application Markup Language)이란?  (0) 2009.11.24
<object /> 태그와 <embed />태그로 실버라이트 적용  (0) 2009.11.24
실버라이트 1.0 개발  (0) 2009.11.24
수작업으로 실버라이트 배포 (RiaDeploy)  (0) 2009.11.24
Posted by holland14
:

<object /> 태그와 <embed />태그로 실버라이트 적용

.NET프로그래밍/Silverlight 3.0 2009. 11. 24. 18:46 |

























[FrmSilverlight.xaml]

 

<Canvas xmlns="http://schemas.microsoft.com/client/2007"

        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

    <TextBlock

        x:Name="lblTitle"

        FontFamily="Malgun Gothic"

        FontSize="20"

        Text="안녕하세요. 반갑습니다."></TextBlock>

</Canvas>

 




-------------------------------------------------------------------------------------



[FrmSilverlight.htm]




<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title></title>

</head>

<body>

    <h3>수작업으로 XAML파일을 웹페이지에 object태그를 사용해서 인클루드</h3>

    <object type="application/x-silverlight"

        id="sil1" width="640" height="100">

        <param name="background" value="silver" />

        <param name="source" value="FrmSilverlight.xaml" />

        <div style="background-color:Gray;">

            이 부분에 대체 콘텐츠를 입력

        </div>   

    </object>   

    </hr>

    <embed type="application/x-silverlight"

        id="sil2" width="640" height="100"

        background="silver"

        source="FrmSilverlight.xaml">

        <noembed>

이 부분에 대체 콘텐츠를 입력

        </noembed>   

    </embed>

</body>

</html>

 

 

-------------------------------------------------------------------------------------



[실행결과]









저작자표시

'.NET프로그래밍 > Silverlight 3.0' 카테고리의 다른 글

XAML(Extensible Application Markup Language)이란?  (0) 2009.11.24
Silverlight.js로 XAML 표시  (0) 2009.11.24
실버라이트 1.0 개발  (0) 2009.11.24
수작업으로 실버라이트 배포 (RiaDeploy)  (0) 2009.11.24
Application 클래스  (0) 2009.11.24
Posted by holland14
:

실버라이트 1.0 개발

.NET프로그래밍/Silverlight 3.0 2009. 11. 24. 18:45 |

 실버라이트 1.0 개발 : 스크립트 디버깅 사용

     

  1. 스크립트 디버깅 활성화
    • IE - 도구 - 인터넷 옵션 - 고급

     

  2. 직접 실행 창
    • 직접 실행 창으로 디버깅



저작자표시

'.NET프로그래밍 > Silverlight 3.0' 카테고리의 다른 글

Silverlight.js로 XAML 표시  (0) 2009.11.24
<object /> 태그와 <embed />태그로 실버라이트 적용  (0) 2009.11.24
수작업으로 실버라이트 배포 (RiaDeploy)  (0) 2009.11.24
Application 클래스  (0) 2009.11.24
RiaHelloWorld  (0) 2009.11.23
Posted by holland14
:

수작업으로 실버라이트 배포 (RiaDeploy)

.NET프로그래밍/Silverlight 3.0 2009. 11. 24. 10:43 |

 

    수작업으로 실버라이트 배포

     

  1. \Silverlight3\RiaDeploy
  2. 새로운 웹 사이트에 아래 순서대로 실행
    • Client 폴더 생성
    • XAP 파일 복사해서 ClientBin 폴더에 붙여넣기
    • 샘플 페이지에서 <object /> 태그 부분을 복사
      • source 속성에 xap파일의 경로를 지정
    • 추가
      • Silverlight.js 파일 붙여넣기
      • onSliverlightError 자바스크립트 함수로 예외 처리




-------------------------------------------------------------------------------------




[MainPage.xaml]



<Grid x:Name="LayoutRoot" Background="White">

        <StackPanel>

            <TextBlock x:Name="lblDisplay" Text="" FontSize="20"></TextBlock>           

            <Button x:Name="btnClick" Content="현재시간"></Button>

        </StackPanel>

</Grid>




-------------------------------------------------------------------------------------




[MainPage.xaml.cs]



using System;

using System.Collections.Generic;

using System.Linq;

using System.Net;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Documents;

using System.Windows.Input;

using System.Windows.Media;

using System.Windows.Media.Animation;

using System.Windows.Shapes;

 

namespace RiaDeploy

{

    public partial class MainPage : UserControl

    {

        public MainPage()

        {

            InitializeComponent();

            // Click Event를 코드비하인드 페이지에서 부여

            btnClick.Click += new RoutedEventHandler(btnClick_Click);

        }

 

        void btnClick_Click(object sender, RoutedEventArgs e)

        {

            lblDisplay.Text = DateTime.Now.ToShortTimeString();

        }

    }

}

 

 



-------------------------------------------------------------------------------------



아래와 그림과 같은 과정을 통해 "새 프로젝트"추가로 "MyWeb"이라는 프로젝트를 생성하고 "새 항목 추가"로 "HTML"형식의 파일인 [RiaDeploy.htm]를 만들어서 아래와 같이 코드를 작성한다.







[RiaDeployTestPage.html]소스코드에서 아래의 [RiaDeploy.htm]소스코드 부분에 형광펜으로 칠해진 부분을 복사하여 붙여넣기함.



[RiaDeploy.htm]



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title>수작업으로 실버라이트 응용프로그램 배포</title>

    <script type="text/javascript" src="Silverlight.js"></script>

    <script type="text/javascript">

        function onSilverlightError(sender, args) {

            var appSource = "";

            if (sender != null && sender != 0) {

                appSource = sender.getHost().Source;

            }

 

            var errorType = args.ErrorType;

            var iErrorCode = args.ErrorCode;

 

            if (errorType == "ImageError" || errorType == "MediaError") {

                return;

            }

 

            var errMsg = "Unhandled Error in Silverlight Application " + appSource + "\n";

 

            errMsg += "Code: " + iErrorCode + "    \n";

            errMsg += "Category: " + errorType + "       \n";

            errMsg += "Message: " + args.ErrorMessage + "     \n";

 

            if (errorType == "ParserError") {

                errMsg += "File: " + args.xamlFile + "     \n";

                errMsg += "Line: " + args.lineNumber + "     \n";

                errMsg += "Position: " + args.charPosition + "     \n";

            }

            else if (errorType == "RuntimeError") {

                if (args.lineNumber != 0) {

                    errMsg += "Line: " + args.lineNumber + "     \n";

                    errMsg += "Position: " + args.charPosition + "     \n";

                }

                errMsg += "MethodName: " + args.methodName + "     \n";

            }

 

            throw new Error(errMsg);

        }

    </script>

</head>

<body>

아래에 실버라이트 실행</br>

 

    <div id="silverlightControlHost" style="border:1px solid red;">

        <object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="300" height="300">

                                     <param name="source" value="ClientBin/RiaDeploy.xap"/>

                                     <param name="onError" value="onSilverlightError" />

                                     <param name="background" value="silver" />

                                     <param name="minRuntimeVersion" value="3.0.40818.0" />

                                     <param name="autoUpgrade" value="true" />

                                     <a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=3.0.40818.0" style="text-decoration:none">

                                                      <img src="http://go.microsoft.com/fwlink/?LinkId=161376" alt="Get Microsoft Silverlight" style="border-style:none"/>

                                     </a>

                      </object><iframe id="_sl_historyFrame" style="visibility:hidden;height:0px;width:0px;border:0px"></iframe>

    </div>

 

</body>

</html>

 

 



----------------------------------------------------------------------------------





[실행결과]







































저작자표시

'.NET프로그래밍 > Silverlight 3.0' 카테고리의 다른 글

<object /> 태그와 <embed />태그로 실버라이트 적용  (0) 2009.11.24
실버라이트 1.0 개발  (0) 2009.11.24
Application 클래스  (0) 2009.11.24
RiaHelloWorld  (0) 2009.11.23
실버라이트 3.0 개발 환경 구축  (0) 2009.11.23
Posted by holland14
:

Application 클래스

.NET프로그래밍/Silverlight 3.0 2009. 11. 24. 09:29 |
 


Application 클래스

  • 실버라이트의 시작과 종료를 관리
  • Startup 이벤트
    • 실버라이트 응용 프로그램이 시작할 때 발생
  • RootVisual 속성
    • 실버라이트 응용 프로그램의 EntryPoint
    • C#의 Main 메서드와 비슷한 역할




    -------------------------------------------------------------------------------------




    [App.xaml.cs]



    public partial class App : Application

        {

     

            public App()

            {

                this.Startup += this.Application_Startup;

                this.Exit += this.Application_Exit;

                this.UnhandledException += this.Application_UnhandledException;

     

                InitializeComponent();

            }

     

            private void Application_Startup(object sender, StartupEventArgs e)

            {

                // 실버라이트 응용프로그램의 시작점

                //this.RootVisual = new MainPage();

                this.RootVisual = new SubPage();

            }

     

            private void Application_Exit(object sender, EventArgs e)

            {

     

            }

     




    -------------------------------------------------------------------------------------



    [MainPage.xaml]



    <Grid x:Name="LayoutRoot" Background="White">

            <TextBlock x:Name="lblTitle" Text="Application Class"

                FontSize="30"></TextBlock>

    </Grid>




    -------------------------------------------------------------------------------------



    [SubPage.xaml]



    <Grid x:Name="LayoutRoot" Background="White">

            <TextBlock x:Name="lblTitle" Text="Sub Page!!!"

                FontSize="30" FontFamily="Verdana"></TextBlock>   

    </Grid>





    -------------------------------------------------------------------------------------




    [실행결과]







    저작자표시

    '.NET프로그래밍 > Silverlight 3.0' 카테고리의 다른 글

    실버라이트 1.0 개발  (0) 2009.11.24
    수작업으로 실버라이트 배포 (RiaDeploy)  (0) 2009.11.24
    RiaHelloWorld  (0) 2009.11.23
    실버라이트 3.0 개발 환경 구축  (0) 2009.11.23
    Silverlight란?  (0) 2009.11.20
    Posted by holland14
    :

    jQuery PlugIn - Validate (유효성 검사)

    .NET프로그래밍/jQuery 1.3.2 2009. 11. 23. 19:23 |



    [Validate.htm]

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

     

    <html xmlns="http://www.w3.org/1999/xhtml">

    <head>

        <title>회원가입</title>

        <script src="../../js/jquery-1.3.2-vsdoc2.js" type="text/javascript"></script>

        <script src="jquery.validate-vsdoc.js" type="text/javascript"></script>

        <script type="text/javascript">

            $(document).ready(function() {

                //$('#myForm').validate(); // 유효성 검사

                $('#myForm').validate({

                    rules: {

                        txtID: { required: true, minlength: 3, remote:"Validate.aspx" },

                        txtPassword: { required: true },

                        txtName: { required: true },

                        txtEmail: { email: true },

                        txtPasswordConfirm: { equalTo: "#txtPassword" },

                        txtAge: { range: [1, 150] }

                    },

                    messages: {

                        txtID: {

                            required: "아이디를 입력하시오.",

                            minlength: jQuery.format("아이디는 {0}자 이상"),

                            remote : jQuery.format("{0}는 이미 있는 아이디")

                        },

                        txtPassword: { required: "암호를 입력하시오." },

                        txtName: { required: "이름을 입력하시오." },

                        txtEmail: { email: "올바른 이메일을 입력하시오." },

                        txtPasswordConfirm: { equalTo: "암호를 다시 확인하세요." },

                        txtAge: { range: "나이는 1~150" }

                    },

                    // 아래 코드는 버그

                    //submitHandler: function () {

                    //    $('#myForm').submit(); // 통과시 전송

                    //},

                    submitHandler: function (frm) {

                        frm.submit(); // 통과시 전송

                    },

                    success: function (e) {

                        //

                    }               

                });

            });

        </script>

    </head>

    <body>

    <form id="myForm" method="post" action="Validate.aspx">

        아이디 : <input type="text" id="txtID" name="txtID" class="required" /><br />

        암호 : <input type="text" id="txtPassword" name="txtPassword" class="required" /><br />

        암호확인 : <input type="text" id="txtPasswordConfirm" name="txtPasswordConfirm" class="required" /><br />

        이름 : <input type="text" id="txtName" name="txtName" class="required" minlength="2" /><br />

        이메일 : <input type="text" id="txtEmail" name="txtEmail" class="required email" /><br />

        나이 : <input type="text" id="txtAge" name="txtAge" /><br />

       

        <input type="submit" value="전송" />

    </form>

    </body>

    </html>

     



    -------------------------------------------------------------------------------------




    [Validate.aspx]


    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Validate.aspx.cs" Inherits="Module_Validate_Validate" %>

     

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

     

    <html xmlns="http://www.w3.org/1999/xhtml">

    <head runat="server">

        <title></title>

    </head>

    <body>

        <form id="form1" runat="server">

        <div>

       

        </div>

        </form>

    </body>

    </html>

     




    -------------------------------------------------------------------------------------




    [Validate.aspx.cs]

    using System;

    using System.Collections.Generic;

    using System.Linq;

    using System.Web;

    using System.Web.UI;

    using System.Web.UI.WebControls;

     

    public partial class Module_Validate_Validate : System.Web.UI.Page

    {

        protected void Page_Load(object sender, EventArgs e)

        {

            if (Request["txtID"] == "RedPlus")

            {

                Response.Write("false"); // 이미 있는 아이디

            }

            else

            {

                Response.Write("true"); // validation 통과

                }

            Response.End();

        }

    }

     




    -------------------------------------------------------------------------------------

     


    [실행결과]


    --> 첫 화면.






    --> '전송'버튼을 눌렀을 때




























    --> 바로위의 그림에서  텍스트박스에 '유효성 검사'에맞게 데이터를 입력한 후 '전송'버튼을 눌렀을 때의 화면.










    저작자표시

    '.NET프로그래밍 > jQuery 1.3.2' 카테고리의 다른 글

    jQuery Ajax + ASP.NET + JSON : String (단일값 반환)  (0) 2009.11.27
    jQuery 수업 자료 PPT 파일  (0) 2009.11.27
    jQuery를 사용한 한줄메모장  (0) 2009.11.19
    파일업로드 : jQuery + Uploadify + ASP.NET  (1) 2009.11.19
    AutoComplete - 텍스트박스 자동 완성 기능  (0) 2009.11.19
    Posted by holland14
    :

    RiaHelloWorld

    .NET프로그래밍/Silverlight 3.0 2009. 11. 23. 16:29 |


    [MainPage.xaml]



    <UserControl x:Class="RiaHelloWorld.MainPage"

        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">

        <UserControl.Resources>

            <Storyboard x:Name="Storyboard1">

                <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="lblDisplay" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)">

                    <EasingDoubleKeyFrame KeyTime="00:00:01" Value="-86.512"/>

                    <EasingDoubleKeyFrame KeyTime="00:00:02" Value="-223.029"/>

                </DoubleAnimationUsingKeyFrames>

                <ColorAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="lblDisplay" Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)">

                    <EasingColorKeyFrame KeyTime="00:00:02" Value="Black"/>

                    <EasingColorKeyFrame KeyTime="00:00:03" Value="#FFC05555"/>

                    <EasingColorKeyFrame KeyTime="00:00:04" Value="#FF76C6D4"/>

                </ColorAnimationUsingKeyFrames>

                <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="lblDisplay" Storyboard.TargetProperty="(UIElement.Opacity)">

                    <EasingDoubleKeyFrame KeyTime="00:00:03" Value="1"/>

                    <EasingDoubleKeyFrame KeyTime="00:00:04" Value="0.5"/>

                </DoubleAnimationUsingKeyFrames>

                <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="lblDisplay" Storyboard.TargetProperty="(TextBlock.FontSize)">

                    <EasingDoubleKeyFrame KeyTime="00:00:02" Value="30"/>

                    <EasingDoubleKeyFrame KeyTime="00:00:03" Value="24"/>

                    <EasingDoubleKeyFrame KeyTime="00:00:04" Value="30"/>

                </DoubleAnimationUsingKeyFrames>

            </Storyboard>

        </UserControl.Resources>

     

        <Grid x:Name="LayoutRoot" Background="White">

            <TextBlock x:Name="lblDisplay" Text="Hello World" FontSize="30" Margin="40,196,189,56" RenderTransformOrigin="0.5,0.5" Foreground="Black">

              <TextBlock.RenderTransform>

                               <TransformGroup>

                                                 <ScaleTransform/>

                                                 <SkewTransform/>

                                                 <RotateTransform Angle="30.343"/>

                                                 <TranslateTransform/>

                               </TransformGroup>

              </TextBlock.RenderTransform>

            </TextBlock>

        </Grid>

    </UserControl>

     




    [MainPage.xaml 디자인]
















    -------------------------------------------------------------------------------------




    [MainPage.xaml.cs]



    using System;

    using System.Collections.Generic;

    using System.Linq;

    using System.Net;

    using System.Windows;

    using System.Windows.Controls;

    using System.Windows.Documents;

    using System.Windows.Input;

    using System.Windows.Media;

    using System.Windows.Media.Animation;

    using System.Windows.Shapes;

     

    namespace RiaHelloWorld

    {

        public partial class MainPage : UserControl

        {

            public MainPage()

            {

                InitializeComponent();

     

                this.Loaded += new RoutedEventHandler(MainPage_Loaded);      

            }

     

            void MainPage_Loaded(object sender, RoutedEventArgs e)

            {

                this.Storyboard1.Begin(); // 스토리보드 실행

            }

        }

    }

     

     



    -------------------------------------------------------------------------------------




    [실행결과]










    저작자표시

    '.NET프로그래밍 > Silverlight 3.0' 카테고리의 다른 글

    실버라이트 1.0 개발  (0) 2009.11.24
    수작업으로 실버라이트 배포 (RiaDeploy)  (0) 2009.11.24
    Application 클래스  (0) 2009.11.24
    실버라이트 3.0 개발 환경 구축  (0) 2009.11.23
    Silverlight란?  (0) 2009.11.20
    Posted by holland14
    :

    티스토리툴바