Recommandé
Contenu connexe
Tendances
Tendances (20)
En vedette
Similaire à Metro#1
Similaire à Metro#1 (20)
Plus de c-mitsuba
Plus de c-mitsuba (20)
Metro#1
- 4. 都市伝説
- 5. profile • H.N. :蜜葉 優 [mitsuba yu] • Expression Blendが好きな人 • さいきんMVPになったらしい • twitter:@mitsuba_tan • Web:http://c-mitsuba.com • blog:http://d.hatena.ne.jp/c-mitsuba
- 8. agenda • わたしの開発環境とつくったもの • Windows Phone アプリを移植してみた • なかまとめ • デザインしよう！ • まとめ
- 9. わたしの開発環境 • Mac OSX Lion – VMware fusion Win8 • VisualStudio11 – VM Win7 • Expression Blend 4 – Adobe Illustrator
- 11. 移植したアプリ • HatenaFotolife • XAML +C# • 作り方はExpression Techにあります。 • http://expressiontech.jp/article/blend/hatena /
- 12. 移植したアプリ
- 13. ＷＰ版の作り方 • １．ソリューションつくる • ２．Expression Blendでデザインつくる • ３．SampleDataSetを使っていいかんじに • ４．はてなフォトライフからデータ取得する • ５．詳細画面作ってページ遷移する
- 14. Expression Blendでデザインつくる • Pivotでレイアウト • New, Hot, Userの画像を表示する用のListBox を作る
- 15. 問題 そもそもBlendがない • Windows 8に入ってるBlendは HTML + JS • XAMLは全部手書き • Pivotなんてない • ListBoxはある
- 16. 解決策．SL版BlendでXAML作る • XAMLを眺めてると、ほとんどSLと一緒です。 • Win7に入れてるSL4 Blendでデザイン作って、 XAMLコピペでうごいた。 • サイズは1366px*768px • ビヘイビアとかは無理。 • 基本的なレイアウトコントロールはある。 • （Win8 64bitでBlend4は起動しないので注意
- 18. SampleDataSetを使っていいかんじに • SampleDataSetを使えば、 Bindingするデータの レイアウトをデータを 見ながら編集できる。 • でもプロジェクトにSampleData ファイルとかApp.xaml になんか追記される。
- 23. WPでフォトライフのデータ取得 • MetroStyleAppsだと同期処理できた • Windows Phone 7では同期処理は御法度。 • XDocument.LoadのURL指定は相対パスしか 認識してくれないのです。
- 24. WPでフォトライフのデータ取得
- 30. 問題 ReactiveExtentions • さすがLinqのかみさま！すてき！ • さっきのコードのままSystem.Reactive.dllをい れてみる
- 32. 問題 DownloadCompletedEventArgs • そんなイベントはMetroにはないよってい われる。 • ObservableとかRx部分は問題ないかんじ。
- 33. 問題 WebClientもないよ • ないないだらけ。。 • WebClientの代わりに、HttpClient使いましょ う という記事があった。 • http://social.msdn.microsoft.com/Forums/en- US/winappswithcsharp/thread/0289a73e-7b5d- 4127-949f-d48ab79543aa
- 34. 今回はRXなし！
- 35. じゃあ非同期は？
- 36. 問題 WebClientもないよ • WebClientの代わりに、HttpClient使いま しょう という記事があった。 • http://social.msdn.microsoft.com/Forums/en- US/winappswithcsharp/thread/0289a73e- 7b5d-4127-949f-d48ab79543aa
- 37. 解決 .NET 4.5 Async & Await • HttpClientに実装されてるGetAsync()で非同 期でXMLをダウンロードするよ！
- 38. 解決 .NET 4.5 Async & Await
- 39. できた！
- 41. これじゃない感。。。
- 42. なかまとめ • SilverlightとかWindows Phoneのコードは xmlnsさえ変えれば動きます！（嘘 • System.Netとかいろいろ変わってる あるものとかないものとかあるから 代わりになるもの探すのが大変＞＜ • あと画面遷移とかだいぶかわってる。 • (扱ってないけど) NavigationServiceとかないので、 Visibilityでページ切り替えたようにみせるか Pageコントロール差し替えてね
- 43. デザインしよう！ これはいやだ
- 44. テンプレートはかっこいい
- 45. テンプレートをよむ ・矢印ボタン <Button x:Name="BackButton” Style= "{StaticResource BackButtonStyle}"/>
- 46. テンプレートをよむ ・タイトル <TextBlock x:Name="PageTitle" Text="{StaticResource AppName}" Grid.Column="1" Style="{StaticResource PageTitleStyle}" />
- 47. テンプレート なんて ただのStyleの あつまり
- 49. 画面サイズの違い ・Windows Phone版では 画面遷移して詳細画面を 表示していました。 ・MetroStyleAppsは画面が 広いので、詳細画面は リストの左に出すことに
- 51. 選択した画像を左のImageに ・SilverlightではImage.Source = Uri型なので Uri型にしたUrlを投げればOKだった。 ・Metroはそれじゃだめ。。。 Image.SourceはUri型じゃなくて ImageSource型でDependencyObject リストに画像が表示されてるのは DataBindingでやってるから良い感じに してくれる。
- 52. 選択した画像を左のImageに
- 58. 完成！
- 59. まとめ
- 60. MetroStyleAppsって SLとかWPのコードとか そのまま動いちゃうし、 XAMLとか xmlnちょっといじったら これもそのまま動くんでしょー
- 61. ・・・。
- 63. まとめ ・なんかいろいろコントロールのプロパティ のクラスが変わってて、ちょっとしたとこ でいままでと違っててはまる。。。 ・DependencyObjectとかおおい ・言い方変えれば、出来るところはちゃんと DataBinding使ってアプリ組もうねって感じ ・.NET 4.5で非同期が標準搭載
- 64. まとめ ・サンプルいっぱいあるから読みましょう。 ・２月にMetroのマーケットをオープンすると かWindows 8 Betaとか出るなんて噂 ・いままじめにやるより、とりあえず２月まで 待ってもいいんじゃないかなー ・クリックしたら指定したURLをIEで開きたいん だけどC#でどうしたらいいか教えて下さい ・ぶれんどまだー？
- 65. 参考URL ・AsyncとかAwaitとか http://bluewatersoft.cocolog-nifty.com/blog/2011/12/c-advent-calend.html ・Windows 8とかsampleとか http://msdn.microsoft.com/en-us/windows/apps/br229512 ・Reactive Extentions Metro http://nuget.org/packages/Rx_Experimental-Main ・はてなフォトライフWPの作り方 http://expressiontech.jp/article/blend/hatena/
- 67. ご清聴ありがとうございました