Silverlight 2 시리즈 (18): 인 스 턴 스 를 종합 한 RSS 리더
원본 출처, 작성 자 정보, 본 성명.그렇지 않 으 면 법 적 책임 을 추궁 할 것 이다.
http://terrylee.blog.51cto.com/342737/67256
개술
Silverlight 2 Beta 1 버 전 은 런 타임 이 든 Tools 든 프레임 워 크 언어 Visual Basic, Visual C \ #, IronRuby, Ironpython, JSON, Web Service, WCF 및 Sockets 지원 등 일련의 새로운 기능 을 지원 하 는 서 프 라 이 즈 를 많이 가 져 왔 습 니 다.'한 걸음 한 걸음 Silverlight 2 시리즈' 글 은 Silverlight 2 기초 지식, 데이터 와 통신, 사용자 정의 컨트롤, 애니메이션, 그래 픽 이미지 등 몇 가지 측면 에서 Silverlight 2 개발 에 신속하게 들 어 갈 것 입 니 다.
본 고 는 앞에서 17 편 에서 말 한 인터페이스 구조, 스타일, 컨트롤 템 플 릿, 데이터 바 인 딩, 네트워크 통신 등 몇 가지 측면 을 종합 하여 종합 사례 인 간단 한 RSS 리더 를 개발 할 것 이다.
인터페이스 레이아웃
우리 가 최종 적 으로 완성 한 RSS 리더 인터페이스 는 다음 과 같다.
세 줄 두 열의 Grid 를 정의 하고 상단 정보, 분할 선과 아래 내용 구역 을 각각 배치 합 니 다.
<Grid.RowDefinitions>
<RowDefinition Height="50">RowDefinition>
<RowDefinition Height="20">RowDefinition>
<RowDefinition Height="*">RowDefinition>
Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="240">ColumnDefinition>
<ColumnDefinition Width="*">ColumnDefinition>
Grid.ColumnDefinitions>
상단 입력 영역 을 설계 하여 Grid 첫 줄 을 통합 하고 StackPanel 을 설치 합 니 다.
<StackPanel x:Name="Header" Orientation="Horizontal"
Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2">
<Image Source="Rss.png" Width="32" Height="32" Margin="10 0 10 0">Image>
<Border Style="{StaticResource titleBorder}">
<TextBlock Text=" Silverlight RSS " Foreground="#FFFFFF"
VerticalAlignment="Center" Margin="12 0 0 0">TextBlock>
Border>
<WatermarkedTextBox x:Name="feedAddress" Width="300" Height="35"
FontSize="16" Margin="10 0 10 0">
<WatermarkedTextBox.Watermark>
<TextBlock Text=" RSS " VerticalAlignment="Center"
Foreground="#FBA430" FontSize="16">TextBlock>
WatermarkedTextBox.Watermark>
WatermarkedTextBox>
<Button x:Name="displayButton" Style="{StaticResource button}"
Content=" " Click="displayButton_Click">Button>
<Button x:Name="fullScreenButton" Style="{StaticResource button}"
Content=" " Click="fullScreenButton_Click">Button>
StackPanel>
두 단추 의 스타일 이 일치 하 는 것 을 감안 하여 App. xaml 에서 button 스타일 을 정의 합 니 다.
<Style x:Key="button" TargetType="Button">
<Setter Property="Width" Value="100">Setter>
<Setter Property="Height" Value="35">Setter>
<Setter Property="Background" Value="#FBA430">Setter>
<Setter Property="Foreground" Value="#FBA430">Setter>
<Setter Property="FontSize" Value="16">Setter>
Style>
<Style x:Key="titleBorder" TargetType="Border">
<Setter Property="CornerRadius" Value="10">Setter>
<Setter Property="Width" Value="220">Setter>
<Setter Property="Height" Value="40">Setter>
<Setter Property="Background">
<Setter.Value>
<LinearGradientBrush StartPoint="0,0">
<GradientStop Color="#FBA430" Offset="0.0" />
<GradientStop Color="#FEF4E7" Offset="0.5" />
<GradientStop Color="#FBA430" Offset="1.0" />
LinearGradientBrush>
Setter.Value>
Setter>
Style>
분할 선 을 정의 하고 Rectangle 로 표시 합 니 다.<StackPanel Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="2" VerticalAlignment="Center">
<Rectangle Style="{StaticResource rectangle}"/>
StackPanel>
그 라 데 이 션 스타일 을 표시 하기 위해 서 다음 과 같이 정의 합 니 다.
<Style x:Key="rectangle" TargetType="Rectangle">
<Setter Property="Width" Value="780">Setter>
<Setter Property="Height" Value="5">Setter>
<Setter Property="RadiusX" Value="3">Setter>
<Setter Property="RadiusY" Value="3">Setter>
<Setter Property="Fill">
<Setter.Value>
<LinearGradientBrush StartPoint="0,0">
<GradientStop Color="#FEF4E7" Offset="0.0" />
<GradientStop Color="#FBA430" Offset="1.0" />
LinearGradientBrush>
Setter.Value>
Setter>
Style>
왼쪽 목록 영역 을 정의 하고 ListBox 로 표시 하 며 ItemTemplate 를 정의 합 니 다.<ListBox x:Name="PostsList" Grid.Column="0" Grid.Row="2"
Margin="10 5 5 10" SelectionChanged="PostsList_SelectionChanged">
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Title.Text}"
TextWrapping="Wrap" Width="200"/>
DataTemplate>
ListBox.ItemTemplate>
ListBox>
마지막 으로 오른쪽 에 있 는 자세 한 정보 영역 을 정의 하고 StackPanel 에 Border 세 개 를 수직 으로 놓 습 니 다.
<StackPanel x:Name="Detail" Grid.Column="1" Grid.Row="2">
<Border CornerRadius="10" Background="#CDFCAE" Margin="10 5 10 10"
Width="540" Height="40">
<TextBlock Text="{Binding Title.Text}" TextWrapping="Wrap"
VerticalAlignment="Center" Foreground="Red"/>
Border>
<Border CornerRadius="10" Background="#CDFCAE" Margin="10 5 10 10"
Width="540" Height="300">
<TextBlock Text="{Binding Summary.Text}" TextWrapping="Wrap"/>
Border>
<Border CornerRadius="10" Background="#CDFCAE" Margin="10 5 10 10"
Width="540" Height="40">
<StackPanel Orientation="Horizontal">
<TextBlock Text=" :" TextWrapping="Wrap"
Foreground="Red" VerticalAlignment="Center"/>
<TextBlock Text="{Binding PublishDate}" TextWrapping="Wrap"
Foreground="Red" VerticalAlignment="Center"/>
StackPanel>
Border>
StackPanel>
인터페이스 레이아웃 은 여기 서 큰 성 과 를 거 두 었 습 니 다.
기능 을 실현 하 다
다음은 데이터 획득 을 실현 하고 WebRequest 로 이 루어 지 며 다른 방식 으로 도 사용 할 수 있 습 니 다.
///
///
///
///
///
private void displayButton_Click(object sender, RoutedEventArgs e)
{
Uri uri = new Uri(feedAddress.Text);
WebRequest request = (WebRequest)WebRequest.Create(uri);
request.BeginGetResponse(new AsyncCallback(responseReady), request);
}
void responseReady(IAsyncResult asyncResult)
{
WebRequest request = (WebRequest)asyncResult.AsyncState;
WebResponse response = (WebResponse)request.EndGetResponse(asyncResult);
XmlReader reader = XmlReader.Create(response.GetResponseStream());
SyndicationFeed feed = SyndicationFeed.Load(reader);
PostsList.ItemsSource = feed.Items;
}
자세 한 정보 보기:
///
///
///
///
///
private void PostsList_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
SyndicationItem item = PostsList.SelectedItem as SyndicationItem;
Detail.DataContext = item;
}
전체 화면 단추 구현 코드:
///
///
///
///
///
private void fullScreenButton_Click(object sender, RoutedEventArgs e)
{
Content contentObject = Application.Current.Host.Content;
contentObject.IsFullScreen = !contentObject.IsFullScreen;
}
실행 효과
실행 후 화면 은 다음 과 같 습 니 다:
콩짜개 의 최신 영화 평론 Feed 입력:
그 중 하 나 를 선택 하면 자세 한 정보 가 표 시 됩 니 다.
종결 어
본 고 는 앞의 17 편의 내용 에 대해 작은 매듭 을 짓 고 간단 한 RSS 판독 기 를 개발 하 였 으 니, 너 는
여기 서 본문 예제 코드 를 다운로드 합 니 다.
본 고 는 "Terry Lee 기술 칼럼" 블 로그 에서 나 온 것 이 니, 반드시 이 출처 를 보존 해 주 십시오.http://terrylee.blog.51cto.com/342737/67256
본 고 는 51CTO. COM 기술 블 로그 에서 나 온 것 이다.
다음으로 전송:https://www.cnblogs.com/hdjjun/archive/2008/12/24/1361474.html
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
다양한 언어의 JSONJSON은 Javascript 표기법을 사용하여 데이터 구조를 레이아웃하는 데이터 형식입니다. 그러나 Javascript가 코드에서 이러한 구조를 나타낼 수 있는 유일한 언어는 아닙니다. 저는 일반적으로 '객체'{}...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.