4JPlayer.Ver1.0-需求分析与实现方法

一、需求来源

我最近正在找android开发方面的工作,并将GTalk的状态设置为“找工作:Android开发”。A公司通过GTalk联系到我,但由于我身在魔都,而A公司位在帝都,故面试方面可能会有所不便;最终想到一个解决方案:给我出一道题,就是以图片的形式展示一小应用的需求,然后由我来实现其功能;由于A公司了解我目前还在上班中,只能利用业余时间来完成,就以一个星期为期。需求如下:4jplayer-需求

二、功能概要

  1. 欢迎界面显示图片和动态点状进度条
  2. 欢迎界面停留一段时间之后跳转到主界面
  3. 主界面由两部分组成:上面3个Tab、下面5个Button
  4. ListItem由三部分组成:图片、文字和按钮
  5. 罗列sdcard中mp3文件
  6. 从服务器获取mp3文件列表
  7. 后台下载mp3文件,并给予提示

三、需求分析与现实方法

1. 欢迎界面显示图片和动态点状进度条,停留一段时间之后跳转到主界面

  • 需求分析
    • 运行app时,首先显示的是欢迎界面
    • 欢迎界面居中显示一张静态图片和一串动态点状进度条
    • 点状进度条循环2轮之后跳转到主界面
  • 实现方法
    • 静态图片和“Loading”字符可以通过配置文件解决
    • 动态点的5种不同状态分别来自于string.xml文件中5个不同的字符串;例如:
      <string name="tv_welcome_dot_1">.</string>
      <string name="tv_welcome_dot_2">..</string>
      <string name="tv_welcome_dot_3">...</string>
      <string name="tv_welcome_dot_4">....</string>
      <string name="tv_welcome_dot_5">.....</string>
    • 新建1个名为LoadHandler的class,该class继承android.os.Handler并重写handleMessage()方法,该方法中通过接收参数使用switch-case进行分类显示string.xml中的5个不同字符串。
    • 新建1个名为LoadThread的class,该class继承java.lang.Thread并重写run()方法,在该方法中调用LoadHandler实例的sendEmptyMessageDelayed()方法来间隔性的发送消息。
    • 在该Activity的onCreate()中调用new LoadThread(loadHandle).start()开启线程。

2. 主界面由两部分组成:上面3个Tab、下面5个Button

  • 需求分析
    • 切换Tab时,中间数据变化,底部button不动。
  • 实现方法
    • 利用1个TabHost组件和1个LinearLayout组件来完成布局,其中LinearLayout组件中包含5个Button组件。
    • 通过以下方法来添加4个不同的Tab:
      // add tab named Remote
      Intent remoteIntent = new Intent();
      remoteIntent.setClass(this, RemoteListActivity.class);
      TabHost.TabSpec remoteSpec = tabHost.newTabSpec("Remote");
      remoteSpec.setIndicator("", res.getDrawable(R.drawable.tab_remote_64));
      remoteSpec.setContent(remoteIntent);
      tabHost.addTab(remoteSpec);

3. 从服务器上下载数据

  • 需求分析
    • 该过程分为两部分:第一,读取服务器上的文件;第二,将读取到的数据写入sdcard中。
  • 实现方法
    • 提供1个字符串形式的URL,通过HttpURLConnection类的getInputStream()得到InputStream。
    • 将得到的InputStream通过FileOutputStream类的write()写入到sdcard中去,当然其中会涉及到File的相关操作。

4. 从服务器获取mp3文件列表

  • 需求分析
    • 该过程分为两部分:第一,读取服务器上承载mp3文件列表的xml文件;第二,通过解析读取到的xml文件来获得mp3文件列表。
  • 实现方法
    • 该xml文件的来源为:
      http://7xl53s.com1.z0.glb.clouddn.com/download/2015/08/server/4jplayer/resources.xml
      代码片段如下:

      <resources> 
      	<resource> 
      		<id>0001</id> 
      		<mp3.name>Vincent.mp3</mp3.name> 
      		<mp3.size>7685487</mp3.size> 
      		<lrc.name>Vincent.lrc</lrc.name> 
      		<lrc.size>2428</lrc.size> 
      	</resource>
      	<resource>...</resource>
      <resources>
    • 通过继承org.xml.sax.helpers.DefaultHandler,并重写其中的startElement()、endElement()和characters()方法来新建1个名为Mp3ListContentHandler类;然后通过以下代码来实现具体的解析:
      /**
       * 传入一String,通过解析其中的标签,返回一个ArrayList对象。
       */
      public static ArrayList parserXML(String xmlContent) {
      	ArrayList mp3InfoList = new ArrayList();
      
      	SAXParserFactory saxParserFactory = SAXParserFactory.newInstance();
      	try {
      		XMLReader xmlReader = saxParserFactory.newSAXParser().getXMLReader();
      		Mp3ListContentHandler mp3ListContentHandler = new Mp3ListContentHandler(mp3InfoList);
      		xmlReader.setContentHandler(mp3ListContentHandler);
      		xmlReader.parse(new InputSource(new StringReader(xmlContent)));
      
      		for (Iterator iterator = mp3InfoList.iterator(); iterator.hasNext();) {
      			Mp3Info mp3Info = (Mp3Info) iterator.next();
      			//System.out.println("mp3Info --> " + mp3Info.toString());
      		}
      	} catch (Exception e) {
      		e.printStackTrace();
      	}
      
      	return mp3InfoList;
      }

5. ListItem由三部分组成:图片、文字和按钮

  • 需求分析
    • 图片位于最左端,文字其次,按钮位于最右端。
  • 实现方法
    • 通过继承android.widget.BaseAdapter,并重写其中的getCount()、getItem()、getItemId()和getView()方法来完成布局。

6. 后台下载mp3文件,并给予提示。

  • 需求分析
    • 点击下载按钮之后,后台启动下载线程;而不是让当前界面停留,直至等到下载完成。
  • 实现方法
    • 通过继承android.app.service,并重写其中的onStartCommand()方法,在该方法中启动线程进行下载;并通过Toast.makeText()方法给予提示。

四、尚欠缺的功能

  1. 播放控制:播放、暂停、上一首、下一首
  2. 显示播放进度条,并能拖动选择播放
  3. 歌词同步
  4. 下载目录可选
  5. 扫描目录可选
  6. 多播放列表

五、源码

http://7xl53s.com1.z0.glb.clouddn.com/download/2015/08/src/4jplayer-1.0.zip

Author: Vincent 4J

about.me/vincent4j

Leave a Reply

Your email address will not be published. Required fields are marked *

To create code blocks or other preformatted text, indent by four spaces:

    This will be displayed in a monospaced font. The first four 
    spaces will be stripped off, but all other whitespace
    will be preserved.
    
    Markdown is turned off in code blocks:
     [This is not a link](http://example.com)

To create not a block, but an inline code span, use backticks:

Here is some inline `code`.

For more help see http://daringfireball.net/projects/markdown/syntax