Ruru' Programming :)

이번 내용은 실버라이트에서 개체가 중첩되어 있을 때 이벤트가 중첩(버블링, Bubbling)되는 현상을 막기 위한 방법인데요.

두서 없이 작성한 내용이라 저도 무슨 소린지 모르겠네요 - _-;;

중요한 내용은 4~5번 내용을 살펴보시면 이해가 되실거에요.

1. XAML 코드

<UserControl x:Class="BubblingEvents.Page"

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

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

Width="400" Height="300">

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

    <Grid x:Name="SubPanel" Margin="28,20,33,26" Background="#FF4084CE" Grid.Row="3">

        <Ellipse x:Name="Ellipse1" Margin="47,48,129,43" Stroke="#FF000000">

            <Ellipse.Fill>

                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

                    <GradientStop Color="#FF0D4C07"/>

                    <GradientStop Color="#FF239E16" Offset="1"/>

                </LinearGradientBrush>

            </Ellipse.Fill>

        </Ellipse>

        <Ellipse x:Name="Ellipse2" Margin="146,79,61,43" Stroke="#FF000000">

            <Ellipse.Fill>

                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

                    <GradientStop Color="#FF490B68"/>

                    <GradientStop Color="#FFF56DFD" Offset="1"/>

                </LinearGradientBrush>

            </Ellipse.Fill>

        </Ellipse>

    </Grid>

<TextBlock x:Name="Output" HorizontalAlignment="Left" VerticalAlignment="Top"/>

</Grid>

</UserControl>

2. C# Code

using System;

using System.Windows;

using System.Windows.Controls;

using System.Windows.Input;

namespace BubblingEvents

{

public partial class Page : UserControl

{

private Int16 _sequence = default(Int16);

public Page()

{

InitializeComponent();

InitHandlers();

}

private void InitHandlers()

{

this.MouseLeftButtonDown += new MouseButtonEventHandler(MouseLeftClickHandler);

this.SubPanel.MouseLeftButtonDown += new MouseButtonEventHandler(MouseLeftClickHandler);

this.Ellipse1.MouseLeftButtonDown += new MouseButtonEventHandler(MouseLeftClickHandler);

this.Ellipse2.MouseLeftButtonDown += new MouseButtonEventHandler(MouseLeftClickHandler);

}

void MouseLeftClickHandler(Object sender, MouseButtonEventArgs e)

{

Trace((sender as FrameworkElement).Name);

}

private void Trace(String name)

{

this.Output.Text = String.Format("[{0}] {1}\n{2}", ++_sequence, name, this.Output.Text);

}

}

}

3. 버블링이 발생한다

(클릭순서 1. 파란배경, 2 녹색원, 3보라원)

4. 버블링 제거 코드

Ellipse를 포함하고 있는 Grid의 이벤트에서만 별도로 이벤트를 작성해 준다

private void InitHandlers()

{

this.MouseLeftButtonDown += new MouseButtonEventHandler(MouseLeftClickHandler);

this.SubPanel.MouseLeftButtonDown += new MouseButtonEventHandler(SubPanel_MouseLeftButtonDown);

this.Ellipse1.MouseLeftButtonDown += new MouseButtonEventHandler(MouseLeftClickHandler);

this.Ellipse2.MouseLeftButtonDown += new MouseButtonEventHandler(MouseLeftClickHandler);

}

void SubPanel_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)

{

Trace((sender as FrameworkElement).Name);

e.Handled = true;

}

5. 상위의 개체가 하위의 개체의 이벤트 전달을 막지 않도록 설정

IsHitTestVisable 속성을 이용하여 사용자의 마우스나 키보드 등의 입력이 전달되는 것을 막지 않을 수 있다.

…

        <Ellipse x:Name="Ellipse2" Margin="146,79,61,43" Stroke="#FF000000" IsHitTestVisible="False">

            <Ellipse.Fill>

                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">

                    <GradientStop Color="#FF490B68"/>

                    <GradientStop Color="#FFF56DFD" Offset="1"/>

                </LinearGradientBrush>

            </Ellipse.Fill>

        </Ellipse>

    </Grid>

<TextBlock x:Name="Output" HorizontalAlignment="Left" VerticalAlignment="Top" IsHitTestVisible="False" />

…

이올린에 북마크하기(0) 이올린에 추천하기(0)

크리에이티브 커먼즈 라이선스

이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-동일조건변경허락 2.0 대한민국 라이선스에 따라 이용하실 수 있습니다.

DispatcherTimer 를 이용해 시계를 만들어보도록 한다.

먼저 using으로 using System.Windows.Threading; Namespace를 추가해야 하고 다음을 따라 진행한다

1. Xaml

    

<UserControl x:Class="ClockSample.Page"

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

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

Width="400" Height="300">

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

<TextBlock FontSize="60" TextAlignment="Center" VerticalAlignment="Center" x:Name="tbTime" Text="12:00:00" />

</Grid>

</UserControl>

1. Code

public Page()

{

InitializeComponent();

TimerSetting();

}

private void TimerSetting()

{

DispatcherTimer timer = new DispatcherTimer()

{

Interval = TimeSpan.FromMilliseconds(50)

};

timer.Tick += new EventHandler(timer_Tick);

timer.Start();

}

void timer_Tick(object sender, EventArgs e)

{

this.tbTime.Text = DateTime.Now.ToString("HH:mm:ss");

}

1. 다음과 같이 시계가 잘 작동한다.

    

   

이올린에 북마크하기(0) 이올린에 추천하기(0)

크리에이티브 커먼즈 라이선스

이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-동일조건변경허락 2.0 대한민국 라이선스에 따라 이용하실 수 있습니다.

Silverlight에서 네비게이션(메뉴에 따른 페이지 호출?)을 작성하기 위해 넘겨온 값에 따라 시작되는 비주얼을 지정하면 된다.

그를 위해 다음과 같은 코드가 필요하다.

Private void Application_Startup(object sender, StartupEventArgs e)

{

String machineid = e.InitParams["machineid"];

this.RootVisual = new Page(machineid);

}

이올린에 북마크하기(0) 이올린에 추천하기(0)

크리에이티브 커먼즈 라이선스

이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-동일조건변경허락 2.0 대한민국 라이선스에 따라 이용하실 수 있습니다.

실버라이트를 Host 하는 플러그–인 구동 정보에 접근이 가능하다
 
쉽게 말해서 Silverlight를 HTML에 띄울 때 설정한 OBJECT 테그의 param 값들에 접근할 수 있다는 소리

• 
  Object 테그에서 Parameter로 설정 정보들 (대부분 읽기전용이다. 왜? html에서 설정한 내용을 읽어온 것이니깐..)

this.Host.Settings.안의 프로퍼티 들을 이용해 다양한 개발이 가능하다.

흠... 유용한 처리를 할 수 있을 듯…

이올린에 북마크하기(0) 이올린에 추천하기(0)

크리에이티브 커먼즈 라이선스

이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-동일조건변경허락 2.0 대한민국 라이선스에 따라 이용하실 수 있습니다.

웹 페이지에서 컨트롤이나 Element에 이벤트를 추가하기 위해 Cross-browser를 고려해야 한다.

이럴 때 다음과 같이 코드를 작성하면 되겠다.

if (window.addEventListener)

{

window.addEventListener('click', SomeClass.ClickEventMethod , false);

}

else

{

window.attachEvent('onclick', SomeClass.ClickEventMethod );

}

특정 타겟 브라우저로 개발을 하더라도 위와 같이 작업하는 습관은 정말 중요할 것 같다.

이올린에 북마크하기(0) 이올린에 추천하기(0)

크리에이티브 커먼즈 라이선스

이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-동일조건변경허락 2.0 대한민국 라이선스에 따라 이용하실 수 있습니다.

Silverlight에서는 OpenFileDialog는 사용 가능하지만 SaveFileDialog는 제공하지 않는다.

이는 사용자 PC에 접근하는 권한이 없기 때문에 파일 저장에 관한 내용은 제공하지 않는다.

Isolated Storage

• 임시로 저장할 수 있는 공간을 XAP Application 마다 제공한다.

아직 이쪽에 내용을 아는 것이 부족한데 천천히 추가해 나가야 겠다. -_ -;;

이올린에 북마크하기(0) 이올린에 추천하기(0)

크리에이티브 커먼즈 라이선스

이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-동일조건변경허락 2.0 대한민국 라이선스에 따라 이용하실 수 있습니다.

실버라이트를 통해 HTML 문서에 접근하여 처리를 할 수 있다.

그에 어떠한 내용이 필요한지 다음과 같이 정리를...
많이 부족하지만 ㅠㅠ..


Access HTML document

// 다음과 같은 위치의 namespace가 필요하다
using System.Windows.Browser;

 

 

// static HtmlPage class provides entry point

HtmlPage.Navigate("주소"); // 지정된 주소로 페이지를 이동한다.

String server = HtmlPage.DocumentUri.Host; // 현재 접속된 페이지의 URI 값을 가져온다

 

 

// HTML 이벤트 엘레먼트에 이벤트를 작성

HtmlElement myButton = HtmlPage.Document.GetElementbyId("myButtonId");

Mybutton.AttachEvent("onclick", new EventHandler(this.myButtonClicked));

이올린에 북마크하기(0) 이올린에 추천하기(0)

크리에이티브 커먼즈 라이선스

이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-동일조건변경허락 2.0 대한민국 라이선스에 따라 이용하실 수 있습니다.

실버라이트로 자바스크립트와 통신할 때 이용할 수 있다.
실버라이트와 페이지 사이에 동적 데이터를 주고 받을 때 사용하면 좋을듯...

1. 메소드 생성

[ScriptableMember]

Public void Search(string name) {…}

2. 등록

HtmlPage.RegisterScriptableObject("entry", this);

3. 엘레먼트에 등록

Var control = document.getElementById("id");

control.Content.Entrypoint…

이올린에 북마크하기(0) 이올린에 추천하기(0)

크리에이티브 커먼즈 라이선스

이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-동일조건변경허락 2.0 대한민국 라이선스에 따라 이용하실 수 있습니다.