저 하늘의 구름처럼~

실버라이트 2.0 FileOpenDialog 본문

실버라이트

실버라이트 2.0 FileOpenDialog

강백호v 2008. 9. 8. 23:15

실버라이트로 홈페이지를 구성하기위해 실버라이트 홈페이지의 샘플 동영상 강의를 몇일 째 보고 있다.영어로  설명하기 때문에  ``; 머라고 설명하는지는 거의 반이상 알아듣지는 못하지만, 열심히 따라하고,프로젝트에 응용하고자 노력중이다 캬캬~샘플 동영상을 보고,그 동영상 강의의 내용을 나름대로 정리하여 블로그에 올리도록 해야겠다~ ㅎㅎ
이동영상 샘플은 로컬에 있는 이미지 파일을 파일다이얼로그를 통해 불러들인 다음 리스트 박스에
추가하고 웹상에 보여주는 어플리케이션을 작성하는 동영상 샘플이다.
사용자 삽입 이미지
                                               - 프로그램 실행 화면 -
동영상샘플은 아래의 사이트로 방문하면 볼수 있을 것이다.
http://silverlight.net/learn/learnvideo.aspx?video=66682-

- Xaml Code -
// 가이드라인의 ShowGridLines 가 트루이면 화면에 영역 구분을 위한 표시선이 활성화 된다.
//만들어진 오브젝트에 속성을 부여하기 위해서는 x:Name에 이름을 정해주고 이름을 통해 부여가 가능
//하다.

<Grid x:Name="LayoutRoot" Background="Black" ShowGridLines="True" >
//행 방향으로 라인 추가
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition Height="48" />
        </Grid.RowDefinitions>
//열 방향으로 라인 추가
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="96" />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
//{Binding}속성을 통해 리스트박스의 아이템구성요소를 동적으로 변경이 가능하다.
//비하인드 코드에서 DataContext를 통해서 Binding 되게 된다.
//SelectionChanged에 연결된 이벤트에서 리스트아이템선택시 수행할 동작을 정의한다.

        <ListBox x:Name="myListBox" ItemsSource="{Binding}" Grid.RowSpan="2" SelectionChanged="OnSelectionChanged">
            <ListBox.ItemTemplate>
                <DataTemplate>
//텍스트 박스에 선택한 파일의 이름을 표시하기위해  {Binding Name}을 사용한다.
                    <TextBlock Text="{Binding Name}" />
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
         <Image x:Name="myImage" Grid.Column="1" />
//Button을 클릭하면 파일다이얼로그가 활성화된다. 비하인드 코드에서 OnLoad에서 정의한다.
        <Button Grid.Row="1" Grid.Column="1" Margin="5" Content="Load" Click="OnLoad" />
    </Grid>

-  Behind Code -
void OnLoad(object sender, EventArgs args)
        {
            OpenFileDialog ofd = new OpenFileDialog()
            {
// Filter의 Tooltip에서는 다음과 같이 뜬다.Gets or Sets the filter string that determines
//what file displayed in the System.Windows.Controls.OpenFileDialog라고 뜬다.
//음.. 해석해본 결과 필터를 통해  윈도우컨트롤오픈다이얼로그에서 어떤 스트링을 표시 할지 결정한
//다.

                Filter = "Jpeg Files (*.jpg)|*.jpg|All Files(*.*)|*.*",Multiselect = true
            };
            if(ofd.ShowDialog() == true)
            {
//DataContext는 Get or Sets the data Context for an element when it participates in data binding
//이라고 하는데, 엘레먼트에 접근하여 데이터를 바인딩하는 역할을 하는것 같다.
//여기서는 Grid에서 Binding 속성을 찾아서 속성을 적용하는데,선택된 파일을 리스트 박스에 추가하
//게 된다.

                LayoutRoot.DataContext = ofd.SelectedFiles;

            }
        }
        private void OnSelectionChanged(object sender, SelectionChangedEventArgs e)
        {
//리스트가 빈 상태가 아니고, 0개이상의 아이템이 존재한다면 실행한다.
            if ((e.AddedItems != null) && (e.AddedItems.Count > 0))
            {
                FileDialogFileInfo fileInfo = e.AddedItems[0] as FileDialogFileInfo;
//비트맵 이미지를 하나 생성하고, Xaml 코드에서 정의한 이미지 엘레먼트에 파일에서 읽어들인
//이미지를 등록시켜 보여준다.

                BitmapImage image = new BitmapImage();
                image.SetSource(fileInfo.OpenRead());
                myImage.Source = image;

            }
        }