第一個Windows Phone 8 程序開發

前段時間在用WP8的【喜馬拉雅客戶端】聽播客節目在使用過程當中有些不足,心想本身動手作作。恰好最近在微博上看到msp的昌偉哥哥經過Fiddler抓包將iphone應用移植到WP8上了,參考他的文章html

WP8開發實例-兔小貝兒歌iphone版移植到WP8實現(1)說作就作,利用週末的時間以及下班後休息時間開始了WP8的探索之旅,差很少一週的時間完成了大部分工做。僅以此來記錄下個人開發過程。web

在整個過程當中使用了Free Telerik UI Controls for Windows 8 and Windows Phone 下拉刷新DataBoundListBox控件,並添加了一些動畫效果,Windows Phone Toolkit 以及 json2csharp 將獲取到的json轉爲對象,加快開發,另外數據庫採用了SQLite。數據庫

1、數據抓取

利用Fiddler抓取到的json數據json

搜索專題API:windows

http://mobile.ximalaya.com/s/mobile/search?condition={keyword}&scope=album&page={pageId}&per_page={pageCount}&device=WP微信

其中keyword 是搜索關鍵字,pageId是返回分頁數id,pageCount是每頁數據條數。app

json數據微信公衆平臺

{
    "responseHeader": {
        "status": 0,
        "QTime": 13,
        "params": {
            "sort": "album_relation desc",
            "start": "0",
            "q": " '很是不着調'",
            "qf": "title^100 intro^5",
            "searchMessage": "{\"domain\":2,\"uid\":9315765,\"keyword\":\"很是不着調\",\"uuid\":\"7b04841945244cb7917fbf2718ac9c3b\",\"time\":\"20140519143526000\",\"from\":\"mobile\"}",
            "wt": "json",
            "fq": "",
            "defType": "dismax",
            "rows": "5"
        }
    },
    "response": {
        "numFound": 866,
        "start": 0,
        "docs": [{
            "category_id": 4,
            "cover_path": "http://fdfs.xmcdn.com/group3/M09/26/E3/wKgDsVMOAg_ijDyWAAaIFerBEYs765_mobile_small.jpg",
            "intro": "其實,我是一個很正直的人。新浪微博@主播掉掉。騰訊微博@掉掉。微信公衆平臺:diaodiao28613。貼吧:黃金第二檔吧。各類聯繫方式,你再找不到我我就……",
            "user_source": "1",
            "id": 222885,
            "title": "很是不着調",
            "updated_at": 1397289600000,
            "created_at": 1384936334000,
            "uid": 1084167,
            "is_v": "true",
            "nickname": "掉掉",
            "avatar_path": "http://fdfs.xmcdn.com/group1/M00/14/5F/wKgDrlFcTZWRkIugAAA-ymQu-Kw034_mobile_small.jpg",
            "tracks": 51
        },
        {
            "category_id": 4,
            "cover_path": "http://fdfs.xmcdn.com/group4/M01/36/66/wKgDs1NECbSilfvoAACkxDpj6A0391_mobile_small.jpg",
            "intro": "",
            "user_source": "1",
            "id": 249020,
            "title": "很是溜+7",
            "updated_at": 1397125162000,
            "created_at": 1396967906000,
            "uid": 3945648,
            "is_v": "true",
            "nickname": "佳期",
            "avatar_path": "http://fdfs.xmcdn.com/group3/M04/78/2F/wKgDslKNmSOze4O1AACAsZnfl28226_mobile_small.jpg",
            "tracks": 12
        },
        {
            "category_id": 6,
            "intro": " 若是你喜歡探險,請記住最珍貴的寶藏並非金子,而是隻有善於觀察和等待的人才能發現真正的寶藏,伊莎貝對探險生活充滿了嚮往,她跟隨探險家爸爸到一個熱帶孤島上尋找寶藏,但伊莎貝和她的爸爸是兩種大相徑庭的探險家——爸爸對古老的、靜止不動的寶藏感興趣,而伊莎貝喜歡活潑運動的大天然,爸爸不停地測量、挖掘,卻徒勞無功,而伊莎貝在無心中發現了驚人的寶藏. ",
            "cover_path": "http://fdfs.xmcdn.com/group3/M0A/3C/D1/wKgDslMYHsrBK2eSAASMbcHJZ1k593_mobile_small.jpg",
            "user_source": "2",
            "id": 15970,
            "title": "很是小公主",
            "updated_at": 1395306582000,
            "created_at": 1370998123000,
            "uid": 1000273,
            "is_v": "true",
            "nickname": "少兒故事",
            "avatar_path": "http://fdfs.xmcdn.com/group1/M00/03/E0/wKgDrVDAWVCT6fnMAAR5t72dsIw715_mobile_small.jpg",
            "tracks": 23
        },
        {
            "category_id": 1,
            "intro": "《伯凡很是道》是中央人民廣播電臺經濟之聲播出的一檔財經時事評論類節目,由21商業評論主編吳伯凡爲你們評述本身獨到鮮明的觀點!21商業評論主編吳伯凡,《冬吳相對論》的主持人之一。",
            "cover_path": "http://fdfs.xmcdn.com/group2/M02/48/12/wKgDsFH02I2iMfzQAAEYAoIwumg350_mobile_small.png",
            "user_source": "2",
            "id": 194638,
            "title": "伯凡很是道",
            "updated_at": 1396378129000,
            "created_at": 1375004719000,
            "uid": 1860534,
            "is_v": "true",
            "nickname": "酷學課堂",
            "avatar_path": "http://fdfs.xmcdn.com/group2/M01/22/42/wKgDr1HJLJnjbROaAADUDrm_qlo232_mobile_small.jpg",
            "tracks": 47
        },
        {
            "uid": 1000095,
            "nickname": "百態人生",
            "is_v": "true",
            "category_id": 9,
            "cover_path": "http://fdfs.xmcdn.com/group1/M00/02/9C/wKgDrlCscFygWxCzAAcyT2FLTLA271_mobile_small.jpg",
            "intro": "每個女孩都但願她是公主,每個女人都但願她是皇后。  紅顏禍水?紅顏之因此成爲禍水,那是由於男人要想蹬這渾水。人天生就是喜歡美麗的事物,只是程度不同。每一個人的需求都是不同的。美麗可愛的女人誰都喜歡。若是沒有人去追捧又哪來的禍水呢?就像你要吃臭豆腐,吃了卻拉肚子,因而你怪這臭豆腐存在質量問題。我說不是,是你的肚子有問題,我吃了爲何就沒拉呢?  女人每每忘記這樣一點:她們的所有的教育無非是教她們意志堅強,抵抗外界的誘惑——可是她們耗費畢生的精力去唆使外界的誘惑。  有兩種男人最愛談女人:女性蔑視者和女性崇拜者。二者的共同點是慾望強烈。從來關於女人的最精彩的話都是從他們口中說出的。那種對女性持公允折中立場的人說不出什麼精彩的話,女人也不愛聽,她們很容易聽出公允折中背後的慾望乏弱。",
            "user_source": "2",
            "id": 782,
            "title": "紅顏往事-正說歷代很是女性",
            "updated_at": 1400125713000,
            "created_at": 1353478276000,
            "avatar_path": null,
            "tracks": 39
        }]
    },
    "highlighting": {
        "222885": {},
        "249020": {},
        "15970": {},
        "194638": {},
        "782": {}
    }
}

而後根據json創建album對象,因爲沒有特殊字段和關係,這裏直接用json2csharp進行生成,結果以下:dom

public class Album
{
    public int category_id { get; set; }
    public string cover_path { get; set; }
    public string intro { get; set; }
    public string user_source { get; set; }
    public int id { get; set; }
    public string title { get; set; }
    public object updated_at { get; set; }
    public object created_at { get; set; }
    public int uid { get; set; }
    public string is_v { get; set; }
    public string nickname { get; set; }
    public string avatar_path { get; set; }
    public int tracks { get; set; }
}

一樣的方法獲得track音頻API與json數據以及對象iphone

API:http://mobile.ximalaya.com/mobile/others/ca/album/track/{albumId}/True/{pageId}/{per_pageCount}?device=WP

albumId是專輯id222885,pageId是當前頁數id,per_pageCount是每頁數據條數

http://mobile.ximalaya.com/mobile/others/ca/album/track/222885/True/1/5?device=WP

Json數據:

{
    "ret": 0,
    "album": {
        "albumId": 222885,
        "categoryId": 4,
        "categoryName": "綜藝娛樂",
        "title": "很是不着調",
        "coverOrigin": "http://fdfs.xmcdn.com/group3/M09/26/E3/wKgDsVMOAg_ijDyWAAaIFerBEYs765.jpg",
        "coverSmall": "http://fdfs.xmcdn.com/group3/M09/26/E3/wKgDsVMOAg_ijDyWAAaIFerBEYs765_mobile_small.jpg",
        "coverLarge": "http://fdfs.xmcdn.com/group3/M09/26/E3/wKgDsVMOAg_ijDyWAAaIFerBEYs765_mobile_meduim.jpg",
        "coverWebLarge": "http://fdfs.xmcdn.com/group3/M09/26/E3/wKgDsVMOAg_ijDyWAAaIFerBEYs765_web_large.jpg",
        "createdAt": 1384936334000,
        "updatedAt": 1400317151000,
        "uid": 1084167,
        "nickname": "掉掉",
        "isVerified": true,
        "avatarPath": "http://fdfs.xmcdn.com/group1/M00/14/5F/wKgDrlFcTZWRkIugAAA-ymQu-Kw034_mobile_small.jpg",
        "intro": "其實,我是一個很正直的人。新浪微博@主播掉掉。騰訊微博@掉掉。微信公衆平臺:diaodiao28613。貼吧:黃金第二檔吧。各類聯繫方式,你再找不到我我就……",
        "introRich": "其實,我是一個很正直的人。新浪微博@主播掉掉。騰訊微博@掉掉。微信公衆平臺:diaodiao28613。貼吧:黃金第二檔吧。各類聯繫方式,你再找不到我我就……",
        "tags": "流行,笑話,脫口秀,掉掉,很是不着調",
        "tracks": 51,
        "shares": 0,
        "hasNew": false,
        "isFavorite": false,
        "playTimes": 7163957,
        "lastUptrackAt": 1400313600000,
        "status": 1,
        "serializeStatus": 0
    },
    "tracks": {
        "list": [{
            "trackId": 2720177,
            "playUrl64": "http://fdfs.xmcdn.com/group5/M01/0B/F1/wKgDtlN0Ynjx0wtxAJLc3oIuh94669.mp3",
            "playUrl32": "http://fdfs.xmcdn.com/group5/M01/0B/E5/wKgDtVN0YoGQ1mPSAElugJVwP-Q644.mp3",
            "downloadUrl": "http://fdfs.xmcdn.com/group5/M01/0B/E5/wKgDtVN0YlmCuYtxAEwyYPRvieM898.aac",
            "title": "【很是不着調】51-誰在12級龍捲風下抽菸啊",
            "duration": 1203.040,
            "processState": 2,
            "createdAt": 1400313600000,
            "coverSmall": "http://fdfs.xmcdn.com/group5/M02/0B/F0/wKgDtlN0YiOD6cwRAAaIFerBEYs560_mobile_small.jpg",
            "coverLarge": "http://fdfs.xmcdn.com/group5/M02/0B/F0/wKgDtlN0YiOD6cwRAAaIFerBEYs560_mobile_large.jpg",
            "uid": 1084167,
            "nickname": "掉掉",
            "smallLogo": "http://fdfs.xmcdn.com/group1/M00/14/5F/wKgDrlFcTZWRkIugAAA-ymQu-Kw034_mobile_small.jpg",
            "userSource": 1,
            "albumId": 222885,
            "albumTitle": "很是不着調",
            "albumImage": "http://fdfs.xmcdn.com/group3/M09/26/E3/wKgDsVMOAg_ijDyWAAaIFerBEYs765_mobile_small.jpg",
            "orderNum": 0,
            "opType": 1,
            "isPublic": true,
            "likes": 1464,
            "playtimes": 41657,
            "comments": 351,
            "shares": 0,
            "status": 1
        },
        {
            "trackId": 2681536,
            "playUrl64": "http://fdfs.xmcdn.com/group5/M00/00/1C/wKgDtVNslGWh2S5VAIjkNqpQmNA426.mp3",
            "playUrl32": "http://fdfs.xmcdn.com/group5/M02/00/1D/wKgDtlNslGSx4_7SAERyLHg3o1A647.mp3",
            "downloadUrl": "http://fdfs.xmcdn.com/group5/M02/00/1D/wKgDtlNslFjxeVo-AEcGRNIl8nw369.aac",
            "title": "【很是不着調】50-打架來講擎天柱最狠了",
            "duration": 1121.380,
            "processState": 2,
            "createdAt": 1400054400000,
            "coverSmall": "http://fdfs.xmcdn.com/group5/M02/00/1D/wKgDtlNslGDgRjx0AAFkFXk9oYA156_mobile_small.jpg",
            "coverLarge": "http://fdfs.xmcdn.com/group5/M02/00/1D/wKgDtlNslGDgRjx0AAFkFXk9oYA156_mobile_large.jpg",
            "uid": 1084167,
            "nickname": "掉掉",
            "smallLogo": "http://fdfs.xmcdn.com/group1/M00/14/5F/wKgDrlFcTZWRkIugAAA-ymQu-Kw034_mobile_small.jpg",
            "userSource": 1,
            "albumId": 222885,
            "albumTitle": "很是不着調",
            "albumImage": "http://fdfs.xmcdn.com/group3/M09/26/E3/wKgDsVMOAg_ijDyWAAaIFerBEYs765_mobile_small.jpg",
            "orderNum": 1,
            "opType": 1,
            "isPublic": true,
            "likes": 1921,
            "playtimes": 68457,
            "comments": 534,
            "shares": 0,
            "status": 1
        },
        {
            "trackId": 2681529,
            "playUrl64": "http://fdfs.xmcdn.com/group5/M02/00/1D/wKgDtlNslBPRN7lPAJgXpGn8Dv0998.mp3",
            "playUrl32": "http://fdfs.xmcdn.com/group5/M02/00/1D/wKgDtlNslADiO5PwAEwL46a9pI8097.mp3",
            "downloadUrl": "http://fdfs.xmcdn.com/group5/M02/00/1B/wKgDtVNsk_LDXXHcAE7pm8T0XpM693.aac",
            "title": "【很是不着調】49-大家那怎麼叫出租車?",
            "duration": 1245.910,
            "processState": 2,
            "createdAt": 1399708800000,
            "coverSmall": "http://fdfs.xmcdn.com/group5/M00/00/1C/wKgDtlNsk9vBZG2YAAaIFerBEYs907_mobile_small.jpg",
            "coverLarge": "http://fdfs.xmcdn.com/group5/M00/00/1C/wKgDtlNsk9vBZG2YAAaIFerBEYs907_mobile_large.jpg",
            "uid": 1084167,
            "nickname": "掉掉",
            "smallLogo": "http://fdfs.xmcdn.com/group1/M00/14/5F/wKgDrlFcTZWRkIugAAA-ymQu-Kw034_mobile_small.jpg",
            "userSource": 1,
            "albumId": 222885,
            "albumTitle": "很是不着調",
            "albumImage": "http://fdfs.xmcdn.com/group3/M09/26/E3/wKgDsVMOAg_ijDyWAAaIFerBEYs765_mobile_small.jpg",
            "orderNum": 2,
            "opType": 1,
            "isPublic": true,
            "likes": 2639,
            "playtimes": 116404,
            "comments": 687,
            "shares": 0,
            "status": 1
        },
        {
            "trackId": 2576631,
            "playUrl64": "http://fdfs.xmcdn.com/group3/M09/5A/EC/wKgDsVNYe0HwqQvnAJF6lKuk-F8392.mp3",
            "playUrl32": "http://fdfs.xmcdn.com/group3/M09/5A/ED/wKgDsVNYe5ygtjlxAEi9W4WaRT0994.mp3",
            "downloadUrl": "http://fdfs.xmcdn.com/group3/M09/5A/EC/wKgDsVNYezKjMd6PAEt6petib8U450.aac",
            "title": "【很是不着調】48-遊戲女發大招了",
            "duration": 1191.730,
            "processState": 2,
            "createdAt": 1399104000000,
            "coverSmall": "http://fdfs.xmcdn.com/group4/M02/46/D4/wKgDs1NYeuuzmtRwAAaIFerBEYs059_mobile_small.jpg",
            "coverLarge": "http://fdfs.xmcdn.com/group4/M02/46/D4/wKgDs1NYeuuzmtRwAAaIFerBEYs059_mobile_large.jpg",
            "uid": 1084167,
            "nickname": "掉掉",
            "smallLogo": "http://fdfs.xmcdn.com/group1/M00/14/5F/wKgDrlFcTZWRkIugAAA-ymQu-Kw034_mobile_small.jpg",
            "userSource": 1,
            "albumId": 222885,
            "albumTitle": "很是不着調",
            "albumImage": "http://fdfs.xmcdn.com/group3/M09/26/E3/wKgDsVMOAg_ijDyWAAaIFerBEYs765_mobile_small.jpg",
            "orderNum": 3,
            "opType": 1,
            "isPublic": true,
            "likes": 2943,
            "playtimes": 160506,
            "comments": 695,
            "shares": 0,
            "status": 1
        },
        {
            "trackId": 2570451,
            "playUrl64": "http://fdfs.xmcdn.com/group3/M0A/59/96/wKgDslNXJObSqSGKAJXsihgwHDM452.mp3",
            "playUrl32": "http://fdfs.xmcdn.com/group3/M0A/59/D1/wKgDsVNXJNGCV6EoAEr2Vhs5MLo802.mp3",
            "downloadUrl": "http://fdfs.xmcdn.com/group3/M0A/59/D1/wKgDsVNXJMGylPJNAE3JUtmrNbg817.aac",
            "title": "【很是不着調】47-我小時候有個夢想,養老虎",
            "duration": 1228.120,
            "processState": 2,
            "createdAt": 1398844800000,
            "coverSmall": "http://fdfs.xmcdn.com/group4/M01/49/12/wKgDtFNXJH2xOKaYAAaIFerBEYs813_mobile_small.jpg",
            "coverLarge": "http://fdfs.xmcdn.com/group4/M01/49/12/wKgDtFNXJH2xOKaYAAaIFerBEYs813_mobile_large.jpg",
            "uid": 1084167,
            "nickname": "掉掉",
            "smallLogo": "http://fdfs.xmcdn.com/group1/M00/14/5F/wKgDrlFcTZWRkIugAAA-ymQu-Kw034_mobile_small.jpg",
            "userSource": 1,
            "albumId": 222885,
            "albumTitle": "很是不着調",
            "albumImage": "http://fdfs.xmcdn.com/group3/M09/26/E3/wKgDsVMOAg_ijDyWAAaIFerBEYs765_mobile_small.jpg",
            "orderNum": 4,
            "opType": 1,
            "isPublic": true,
            "likes": 2447,
            "playtimes": 137545,
            "comments": 576,
            "shares": 0,
            "status": 1
        }],
        "pageId": 1,
        "pageSize": 5,
        "maxPageId": 11,
        "totalCount": 51
    },
    "msg": "0"
}

詳細的專輯:Albumdetail

public class AlbumDetail
{
    public int albumId { get; set; }
    public int categoryId { get; set; }
    public string categoryName { get; set; }
    public string title { get; set; }
    public string coverOrigin { get; set; }
    public string coverSmall { get; set; }
    public string coverLarge { get; set; }
    public string coverWebLarge { get; set; }
    public long createdAt { get; set; }
    public long updatedAt { get; set; }
    public int uid { get; set; }
    public string nickname { get; set; }
    public bool isVerified { get; set; }
    public string avatarPath { get; set; }
    public string intro { get; set; }
    public string introRich { get; set; }
    public string tags { get; set; }
    public int tracks { get; set; }
    public int shares { get; set; }
    public bool hasNew { get; set; }
    public bool isFavorite { get; set; }
    public int playTimes { get; set; }
    public long lastUptrackAt { get; set; }
    public int status { get; set; }
    public int serializeStatus { get; set; }
}

音頻:

public class Track
{
    public int trackId { get; set; }
    public string playUrl64 { get; set; }
    public string playUrl32 { get; set; }
    public string downloadUrl { get; set; }
    public string title { get; set; }
    public double duration { get; set; }
    public int processState { get; set; }
    public object createdAt { get; set; }
    public string coverSmall { get; set; }
    public string coverLarge { get; set; }
    public int uid { get; set; }
    public string nickname { get; set; }
    public string smallLogo { get; set; }
    public int userSource { get; set; }
    public int albumId { get; set; }
    public string albumTitle { get; set; }
    public string albumImage { get; set; }
    public int orderNum { get; set; }
    public int opType { get; set; }
    public bool isPublic { get; set; }
    public int likes { get; set; }
    public int playtimes { get; set; }
    public int comments { get; set; }
    public int shares { get; set; }
    public int status { get; set; }
}

2、APP設計

由於第一次嘗試WP8開發,因此功能儘可能簡單,APP功能以下:

  • 提供搜索專輯
  • 提供添加到收藏功能
  • 後臺連續播放功能
  • 下載功能(未實現)
  • 播放進度提示 (拖拽進度未實現)
  • 已播放提示

參考MVVM開發模式,本身也進行了嘗試,完成了這次開發。詳細的開發記錄將在後續發上來。哈哈24k純屌絲,無聊的時候聽聽喜馬拉雅段子來了很是不着調、今晚80脫口秀。

主要頁面截圖:

mypodcast01mypodcast02[4]

mypodcast03mypodcast04mypodcast05

相關文章
相關標籤/搜索