Android Smart Dict - 显示单词详细内容

这几天想来想去，感觉查询界面的list item中间空白的地方不显示一些东西好像浪费了，决定还是要加点什么内容。想想用户在查询一个单词的时候，有时候往往并不是不知道这个单词的意思，只是一时想不起来了，那么他查单词的时候只要一看见意思，可能就会恍然大悟，那么这个时候也许就不需要展示单词的全部解释，只需要一个提示信息。那我就可以在list item这里的空位显示单词的中文解释起到提示的作用，用户看到之后也许就不用点击进入详细信息的界面了，快捷又方便。好吧，加内容，顺便再加一个背景图片。

 

<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:padding="5dip"> <TextView android:id="@+id/word" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textSize="@dimen/text_size_medium" android:includeFontPadding="false" android:layout_centerVertical="true" android:singleLine="true"/> <TextView android:id="@+id/translation" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginLeft="5dip" android:textColor="@color/grey" android:textStyle="italic" android:ellipsize="end" android:singleLine="true" android:layout_centerVertical="true" android:layout_toRightOf="@id/word" android:layout_toLeftOf="@+id/word_statistics"/> <include android:id="@id/word_statistics" layout="@layout/word_statistics"/> </RelativeLayout>

你一定会看到里面include了一个word_statistics的东西，这个就是之前的那个什么查询了多少次，学习了多少次。。。因为后面我还需要用到这个东西，所以我单独建立了一个文件，这里只需要include就可以了，以免后面用到还要拷贝一份相同的代码。

 

新加入的解释部分的内容相对于其他的东西不那么重要，所以字体用斜体，颜色用灰色就可以了，和其他的内容就比较好区分。

 

来看看效果如何：

 

嘿嘿，加了背景效果还不错，总的结构看起来也紧凑了很多，哈哈哈哈。

 

好吧，进入今天的正题，显示单词的详细内容。

 

这个看起来很不好办，因为我们现在的单词库里边只有拼写，音标和解释这三个东西，用一整屏幕的地方来放置这么一点点内容，实在不好弄。这个界面究竟如何设计呢？伤脑筋！

 

经过多次演示，我打算垂直居中依次显示单词，音标，list item里面那个单词统计，然后是单词解释。

 

代码如下：

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:gravity="center"> <LinearLayout android:orientation="vertical" android:layout_width="wrap_content" android:layout_height="wrap_content"> <TextView android:id="@+id/name" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginBottom="5dip" android:textSize="@dimen/text_size_large" android:gravity="center" android:textStyle="bold"/> <TextView android:id="@+id/symbol" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginBottom="20dip" android:gravity="center" android:textSize="@dimen/text_size_medium"/> <include layout="@layout/divider"/> <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:gravity="center" android:orientation="horizontal"> <include layout="@layout/word_statistics"/> /</LinearLayout> <include layout="@layout/divider"/> <TextView android:id="@+id/translation" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_marginTop="20dip" android:gravity="center" android:textSize="@dimen/text_size_medium"/> </LinearLayout> </LinearLayout>

 

那个单词统计的bar上下各加一个分割线，当然这个divider也是include的单独的文件，都是为了避免重复的拷贝代码提高维护效率。

 

然后我再创建一个WordDetailActivity的类，用来显示单词的详细内容。大概就是用户在之前的list里面任意点击了一项之后，在onItemClickListener里面创建一个WordDetailActivity的intent，然后把用户选中的单词的id作为extra信息传进去，WordDetailActivity在onCreate的时候取得id查找出相应的单词予以显示。

 

代码如下：

public class WordDetailActivity extends Activity { private TextView mTextWord; private TextView mTextSymbol; private TextView mTextTranslation; private TextView mTextSearchCount; private TextView mTextStudyCount; private TextView mTextMistakeCount; private TextView mTextLevel; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); requestWindowFeature(Window.FEATURE_NO_TITLE); initUi(); Intent intent = getIntent(); long id = intent.getLongExtra(SearchBoardActivity.INTENT_EXTRA_WORD_ID, -1); if (id >= 0) { new LoadWordTask(this).execute(id); } } private void initUi () { setContentView(R.layout.screen_word_detail); mTextWord = (TextView) findViewById(R.id.name); mTextSymbol = (TextView) findViewById(R.id.symbol); mTextTranslation = (TextView) findViewById(R.id.translation); mTextSearchCount = (TextView) findViewById(R.id.search_count); mTextStudyCount = (TextView) findViewById(R.id.study_count); mTextMistakeCount = (TextView) findViewById(R.id.mistake_count); mTextLevel = (TextView) findViewById(R.id.level); } private void setData (Word word) { mTextWord.setText(word.getWord()); mTextSymbol.setText(word.getSymbol()); mTextTranslation.setText(word.getTranslation()); mTextSearchCount.setText(String.valueOf(word.getSearchCount())); mTextStudyCount.setText(String.valueOf(word.getStudyCount())); mTextMistakeCount.setText(String.valueOf(word.getMistakeCount())); mTextLevel.setText(String.valueOf(word.getLevel())); } private static final class LoadWordTask extends AsyncTask<Long, Void, Word> { private final WeakReference<WordDetailActivity> activityRef; public LoadWordTask (WordDetailActivity activity) { activityRef = new WeakReference<WordDetailActivity>(activity); } @Override protected Word doInBackground(Long... id) { final WordDetailActivity activity = activityRef.get(); if (activity != null) { DatabaseHelper helper = DatabaseHelper.getInstance(activity); Cursor cursor = helper.queryWordDetailById(id[0]); if (cursor.moveToFirst()) { Word word = new Word(); word.setWord(cursor.getString( cursor.getColumnIndexOrThrow(WordTable.COLUMN_NAME_WORD))); word.setSymbol(cursor.getString( cursor.getColumnIndexOrThrow(WordTable.COLUMN_NAME_SYMBOL))); word.setTranslation(cursor.getString( cursor.getColumnIndexOrThrow(WordTable.COLUMN_NAME_TRANSLATION))); word.setExample(cursor.getString( cursor.getColumnIndexOrThrow(WordTable.COLUMN_NAME_EXAMPLES))); word.setBookRef(cursor.getString( cursor.getColumnIndexOrThrow(WordTable.COLUMN_NAME_BOOKS))); word.setLevel(cursor.getInt( cursor.getColumnIndexOrThrow(WordTable.COLUMN_NAME_LEVEL))); word.setMistakeCoumt(cursor.getInt( cursor.getColumnIndexOrThrow(WordTable.COLUMN_NAME_MISTAKE_COUNT))); word.setPronunciation(cursor.getString( cursor.getColumnIndexOrThrow(WordTable.COLUMN_NAME_PRONUNCIATION))); // Every time search one word should increase its search count; word.setSearchCount(helper.increaseWordSeachCountById(id[0])); word.setStudyCount(cursor.getInt( cursor.getColumnIndexOrThrow(WordTable.COLUMN_NAME_STUDY_COUNT))); return word; } } return null; } @Override protected void onPostExecute(Word word) { final WordDetailActivity activity = activityRef.get(); if (activity != null && word != null) { activity.setData(word); } } } }

 

在这里同样要注意的一点就是，查询数据库一定要用单独的线程来做，以免block掉UI主线程，所以我这里还是采用AsyncTask来完成。

 

除此以外这里还有一个问题，我们在单词统计信息里面有关于查询次数的显示，那么何时修改这个数据呢？就是在用户每次进入单词详细内容的时候增加一次，所以这里在查询单词信息成功以后修改查询次数字段，加一。当然就别忘了在回到查询界面的时候更新list的显示数据。

 

来看看效果如何：

 

 

嗯，看起来还行吧，这里显示这个单词已经被我无情地查询了3次。

 

今天就这样了。