ฝนตก ฟ้าร้อง ฟ้าผ่า .... เปรี้ยง!! ตอนแรก

 

อากาศช่วงนี้เป็นช่วงที่แปรปรวนมากประเดี๋ยวฝนตก  ประเดี๋ยวแดดออก  วุ่นวายไปหมด  เฉพาะฉะนั้นมาลองเขียนโปรแกรมง่ายๆ เกี่ยวกับฝนฟ้าอากาศกัน  จะได้รู้ว่าฟ้าฝนช่วงนี้จะเป็นใจหรือเปล่า

1.       สร้างโปรเจคขึ้นมาใหม่

2.      สร้างกล่องข้อความและรูปภาพสำหรับแสดงด้วยในไฟร์  xam

<StackPanel Orientation="Vertical">

   <StackPanel Orientation="Horizontal" Height="200">

   <StackPanel Orientation="Vertical" Width="250">

   <TextBlock x:Name="lblCurrent" Text="Current" FontSize="32" Style="{StaticResource PhoneTextTitle1Style}" VerticalAlignment="Center" />

   <TextBlock x:Name="lblCurrent_conditions" Text="Weater" Foreground="DarkGray" FontSize="21" Margin="20,-8" Style="{StaticResource PhoneTextTitle1Style}" VerticalAlignment="Center" />

     </StackPanel>

     <Image x:Name="imgWeather1" Source="/WindowsPhoneApplication5;component/Images//11n.png" Width="267" Height="194" />

</StackPanel>

</StackPanel>

 

จะได้หน้าตาดังรูป

สำหรับรูปภาพสามารถดาวโหลดได้ในบทความนี้

3.       ต่อไปก็แหล่งอ้างอิงการพยาการอากาศ  ในที่นี้เราจะใช้  yahoo weater  ที่ http://weather.yahoo.com/  จากนั้นก็เลือกจังหวัดที่เราต้องการ

 

ก็จะปรากฎหน้าจอแสดงสภาพอากาศของจังหวัดที่เราต้องการ

4.       เราจะทำการอ้างอิงมาโดยใช้ Rss  ให้คลิกที่ปุ่ม    เพื่อดูรายละเอียด  จะเห็นหน้าตาแบบนี้

อาจจะสงสัยว่าแล้วเราจะอ้างอิงมายังไง  เราก็ต้องไปดูที่ Code  ว่า มี  Tag อะไรบ้างที่เราจะใช้อ้างอิง

จะเห็น Tag <yweater> ซึ่งเป็น Tag ที่เก็บข้อมูล  เราจะใช้ Tag นี้ในการอ้างอิง

5.      กลับมาที่ Project  เพื่อเริ่มเขียนโค้ดกัน  การทำงานจะแบ่งเป็น 2 ส่วนใหญ่ๆ คือ  ส่วนที่แสดงข้อมูลและส่วนที่แสดงรูปภาพ 

5.1   อ้างอิงไปยังเว็ปไซต์ด้วยการเขียนโค้ดที่ page_Loaded ดังนี้

private void PhoneApplicationPage_Loaded(object sender, RoutedEventArgs e)

        {

            WebClient wc1 = new WebClient();

            wc1.DownloadStringCompleted += new DownloadStringCompletedEventHandler(wc1_DownloadStringCompleted);

            wc1.DownloadStringAsync(new Uri("http://weather.yahooapis.com/forecastrss?p=THXX0002&u=c"));

        }

สำหรับ Url ของเว็ปให้เอามาจากหน้าของ Rss Feed

6.       จากข้อที่ 5   จะเห็นว่าเมื่อโหลดข้อมูลจากเว็ปเรียบร้อยแล้วเราบอกให้ทำงาน ที่ wc1_DownloadStringCompleted  ซึ่งเราก็จะเขียน wc1_DownloadStringCompleted    เพื่อดังเอาข้อมูลมาใส่ไว้ใน TextBlock ที่เราต้องการ

6.1  Add reference System.Xml.Linq  ดังภาพ

 

            6.2  เพิ่ม using System.Xml.Linq;  ไว้ที่หัว

6.3  อาจจะสงสัยว่าทำไมเราต้อง Addreference XML ด้วย  เพราะข้อมูลที่เราได้มาเราจะยัดใส่ Xml นั้นเองและเรียกข้อมูลออกมาด้วย Linq  โดยการเขียนโคดใน  wc1_DownloadStringCompleted ดังนี้

6.4  ทดสอบรันจะเห็นว่ามีข้อความแสดงสภาพอากาศและอุณหภูมิแต่ยังไม่แสดงผลรูปภาพ

 

6.5  ต่อมาเราจะทำให้แสดงรูปภาพด ก่อนอื่นทำการ Add Reference System.Windows.Media.Imaging

6.6 เพิ่ม code ลงไปดังนี้

6.7  สร้างเมตอดสำหรับรูปในสภาพอากาศต่างๆ ดังนี้

6.8  ทดสอบแสดงผลจะได้ดังนี้