[WP7] PivotApplication Window Phone7 2011. 12. 8. 14:43
피봇 어플리케이션을 보면.. 딱 드는 생각은 C#에서의 Tab과 같은 형국이다.

단 차이가 있다면 활성화 된 탭 내용이 처음에 나온다는 것.(C#에서는 탭 인덱스가 바뀌어 그 부분이 활성화되지만 여기에선 마치 현재 화면의 탭이 제일 처음에 있는 것으로 확인)

프로젝트를 생성하고 보면 파노라마와 비슷한 형태를 확인 할 수 있다.

controls:PivotItem 에서부터 시작하는 화면이 하나의 페이지라고 생각을 하면 된다.

실행 화면은 생략하고 여지껏 해 본 기본적인 내용들을 여기에 접목 시켜 테스트 해 보는 것도 나쁘지 않을 듯 하다.

저작자표시 비영리 변경금지
,
[WP7] PanoramaApplication Window Phone7 2011. 12. 8. 14:37
파노라마는 Navigation의 진보한 매체이다.

현재 스마트 폰을 쓰는 사람들은 이미 그 파노라마 효과를 보고 있다.

대표적인 것으로 안드로이드의 경우에 보면 하나의 큰 화면을 옆으로 넘기면서 그 배경을 확인한다.

그것이 바로 파노라마 라는 것이다.

파노라마 프로젝트를 열어서 보면 ImageBruch라는 부분이 있다. 그것이 기본적으로 배경화면을 나타낸 것인데 이것을 바꾸어서 확인해보아도 좋다.

그리고 controls:PanoramaItem 부터 시작하는 부분이 가져다 붙이는 한 화면당 처리 내용이다.

이것을 원하는 만큼 화면을 구성해서 쓸 수가 있다.

실행 화면은 생략하고 여지껏 해 본 기본적인 내용들을 여기에 접목 시켜 테스트 해 보는 것도 나쁘지 않을 듯 하다.

저작자표시 비영리 변경금지
,
[WP7] WebBrowser Window Phone7 2011. 12. 8. 14:24
웹브라우져는 C#의 컴포넌트와 동일하게 생각을 하면 된다.

단 다른 점이 있다면 Navigate 할 때 C#의 경우 주소를 string 형식으로 박아 넣어도 되었지만

망고에서는 new Uri("http://www.xbox.com") 형식으로 주소를 호출 해야한다.

다음이 실행 결과를 나타낸다.(버튼 클릭 하면 웹브라우져 연결)

저작자표시 비영리 변경금지
,
[WP7] TextBlock Window Phone7 2011. 12. 8. 14:12
텍스트 블록은 텍스트 박스와 아주 흡사하다.

다른 점을 꼽자면 Run을 이용하여 텍스트를 추가하고(폰트나 이런 내용다 다 조절 가능)

LineBreak를 이용하여 줄을 바꿀 수가 있다.

LineBreak가 없다면 줄이 바뀌지가 않음을 확인 할 수 있다.


실행 결과는 다음과 같다.


저작자표시 비영리 변경금지
,
[WP7] Slider Window Phone7 2011. 12. 8. 13:48
슬라이더는 어떤 값을 선택 할 때 Visual 하게 그 값을 선택하게 해 준다.

이 컨트롤의 Orientation 속성에 따라 가로 형태(Horizontal)와 세로 형태(Vertical)로 나타 낼 수가 있다.

IsDirectionReversed를 통하여 값의 증가 방향을 선택 할 수 있다.


위와 같이 ValueChanged를 추가를 해 주면 CS 상에서는

slider1_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e) 함수가 생긴다. 그 안에서 내용을 처리하면 된다.

실행 결과는 다음과 같다.


저작자표시 비영리 변경금지
,
[WP7] ScrollViewer Window Phone7 2011. 12. 8. 13:36
스크롤 뷰어.. 음.. 말 그대로 뷰어에 스크롤이 동작한다.

XAML 부분에
<Canvas>
<ScrollViewer Height="200" Width="200" HorizontalScrollBarVisibility="Auto" Canvas.Top="39" Canvas.Left="34">
<TextBlock Canvas.Top="60" Canvas.Left="20" Width="300" TextWrapping="Wrap"Text="test1.test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1test1End"/>                                     </ScrollViewer>
</Canvas>
이 코드를 추가를 해 주면 가로 세로 스크롤을 이용하여 내용을 확인 할 수 있다.

일단 순서는 캔버스를 올리고 거기에 스크롤 뷰어를 올린다.

HorizontalScrollBarVisibility, VerticalScrollBarVisibility 이 속성들이 각각 가로와 세로를 나타낸다.

여기서 잠깐!! 이 컨트롤러를 그냥 일반적인 C#에서의 스크롤로 생각을 하면 안되고!!

이 자체가 뷰어임을 명심해야한다.!!

실행결과는 다음과 같다.

저작자표시 비영리 변경금지
,
[WP7] RadioButton Window Phone7 2011. 12. 8. 11:51
라디오 버튼은 같은 그룹 내에서는 하나만 설정이 가능하다.

여기에서 그룹 지정 방법은 XAML 상에서 GroupName을 설정하거나 속성에서 지정 하여도 된다.

그럼 각기 그룹에 따라서 선택 여부가 바뀐다.

여기에 이제 이벤트를 붙여 줘야 함으로 XAML 상에서 Checked 이벤트를 해당 함수와 연결 해 주면 된다.


CS의 코드는 다음과 같다.
private void check(object sender, RoutedEventArgs e)
{
  RadioButton radio = sender as RadioButton;
  PageTitle.Text = radio.GroupName;
}
다음은 실행 결과이다.


저작자표시 비영리 변경금지
,
[WP7] ProgressBar Window Phone7 2011. 12. 8. 11:24

진행 상태를 나타내는 ProgressBar.

WP7에서는 두가지 방식을 나타낸다. 일반적으로 우리가 알고 있는 100% 맥시멈까지만 보여주는 것이 있고

계속 진행하는 상태가 반복되는 형식이 있다.

이것은 속성에서 IsIndeterminate 값이 True냐 False냐 따라 차이가 난다.

False의 경우는 전자의 형태를 나타내고 True 경우에는 후자의 경우를 나타낸다.

다음은 두개의 ProgressBar를 올리고 속성 값을 서로 다르게 했을 경우 나타나는 결과이다.

저작자표시 비영리 변경금지
,
[WP7] PasswordBox Window Phone7 2011. 12. 8. 10:58
첨에 그냥 무작정 해 봤을 때는 입력 내용을 패스워드 화 하는 줄 알았는데 그게 아니었다.

PasswordBox를 올려주고 속성에서 Password 입력을 하고 난 다음 버튼을 누르면 그 내용이 보이게 한 예제이다.

기존 내용하고 조금 헛갈릴지도 모르겠다.


실행 결과는 다음과 같다.


저작자표시 비영리 변경금지
,
[WP7] MediaElement Window Phone7 2011. 12. 8. 10:47
말 그대로 Media 매체를 재생 할 수가 있다.

지원되는 미디어는 아래와 같다.

 Delivery Method  지원 컨테이너
Progressive Download Windows Media, MP4, MP3, ASX
Windows Media Streaming over HTTP Windows Media, SSPL(Server Side Play List)
Smooth Streaming fMP4
ASX Windows Media, MP4, ASX
PlayReady DRM MP4
Server Side Playlist Windows Media
MediaStreamSource  개발자가 만든 컨트롤에서 제공하는 내용

하나의 프로젝트를 생성하고 난 다음 MediaElement를 올리고 난 다음 프로젝트 상에 MP3 파일 하나를 추가하고 난 다음

속성에서 Copy to Output 속성을 Copy always로 맞춘다.


그러고 난 다음 XAML 상에 코드를 다음과 같이 입력하고 난 다음 실행하면 바로 MP3 파일이 실행 되는 것을 확인 할 수 있다.
삽입 할 코드 내용은 다음과 같다.
<MediaElement Height="533" HorizontalAlignment="Left" Margin="31,34,0,0" Name="mediaElement1" Source ="1407_2081_1.MP3" AutoPlay="True" VerticalAlignment="Top" Width="397" />
저작자표시 비영리 변경금지
,

티스토리툴바