3

GMail for 3.0+で行われるように各行がマークされているListViewを作成することに興味があります。これにより、左右の ListFragment が適切に分離されます。

他の例には、2.3.4 の Google カレンダーも含まれます。たとえば、カラー マーカーが ListView の左側にあります。

GMail リストビュー

2 つのリストの間にあるグレーの垂直分割線を確認してください。どうやってこのようなことを達成するのですか？おまけに幅が交互になっていることもありますが、それはレイアウトの変更が小さいだけだと思います。

そこに ImageView を挿入して、好きな色で塗りつぶすようなことができると思いますが、これは醜いハックだと思います。

もう 1 つの質問は、GMail またはメール アプリケーションが行うように、2 つの ListView フラグメントを何らかの方法で結合する一般化された方法があるかどうかです。

2 つのフラグメントにわたる GMail ListView

4

3 に答える 3

1

速度が必要な場合はRelativeLayout、行コンテナー View にカスタム View クラス (extend など) を使用し、メソッドをオーバーライドしますdispatchDraw(Canvas canvas)。

このdispatchDrawメソッドは、ビューが独自のコンテンツを描画した後、子を描画する前super.dispatchDrawに呼び出されます。子は、 を呼び出すと描画されます。

これを使用して、次のようなことを行います

private boolean mDrawMarker = false;

public void setShouldDrawMarker(boolean drawMarker) {
    mDrawMarker = drawMarker;
}
public boolean getShouldDrawMarker() {
    return mDrawMarker;
}

@Override
public void dispatchDraw(Canvas canvas) {
    // draw the children of our view 
    super.dispatchDraw(canvas);

    // draw our marker on top of the children if needed
    if (mDrawMarker) {
        // e.g. canvas.drawRect(...) or canvas.drawBitmap(...)
    }
}

このようにして、余分なビューを階層に追加することを回避できます。つまり、レイアウトや測定フェーズでペナルティが発生することはありません。毎回新しい長方形を作成するのではなく、長方形を描画する場合はPaint、 とオブジェクトを再利用することを忘れないでください。Rect同様に、ビットマップを使用する場合は、毎回リソースから新しいものをロードするのではなく、View のすべてのインスタンスで同じ Bitmap インスタンスを共有する必要があります (これは、それらをフィールドに配置することを意味するものではありません)。static

この場合、リストが重複していないように見えるため、アイテムのインデントについては、次のことができます（私の頭の上から）：

  • 行コンテナに左マージンを設定します（これが機能するかどうかは完全にはわかりません）
  • 行コンテナーを a でラップし、LinearLayoutこれに左パディングを設定します (上記が機能しない場合)
  • カスタム ビュー クラスを使用する (左マージンの設定が機能しない場合)
  • @commonsware の提案に従い、2 つのビューを使用します。1 つは左側に灰色の背景色、もう 1 つはその右側にマーカーの色があります。インデント

2 番目の例でのビューの重複については、@commonsware の回答に従います。

于 2011-05-20T17:49:18.117 に答える
1

問題を正しく理解しているかどうか教えてください.... 特定の行を選択済みとしてマークしたいのですが、選択した行が視覚的にインデントされているように見えます (色とマージンが異なります)。

ここに2つのテクニックがあります：

1 - 行の背景に StateListDrawable を使用する:

その場合、リスト行レイアウト ファイルを作成し、「background」プロパティを StateListDrawable (XML の場合もある) に設定します。これにより、選択された行と選択されていない行の表示状態を切り替えることができます。

StateListDrawable の "drawable" 属性は、9 パッチの PNG で、1 つはマージンを含まない非選択状態用、もう 1 つは選択された状態用です。コンテンツ領域/下の黒い線が PNG の左側に完全に拡張されないようにし、スケーリングされていないマージンである領域を残します。

これを見つけた人々のために、Radley Marx は 9 パッチに関する優れた投稿を投稿しました: http://radleymarx.com/blog/simple-guide-to-9-patch/

ListViews では、"listSelector" (リストの上または後ろに表示される別のエンティティ) をオフにして、代わりに "duplicateParentState" 属性を使用して、行自体が選択を表示できるようにする場合があります (リストはありません)。セレクターが必要です)。これにより、特に特定の行に可変幅の余白を持たせたい場合や、すべて異なって見えるいくつかの種類の行を作成したい場合に、もう少し創造的な自由が得られます。デザインにもよるけど。

2 - 各行にマージンを使用する:

複数のタイプのカラー インジケーターなどが必要であると判断した場合は、margin 属性を提供する別のアプローチを使用する必要がある場合があります (これはおそらくすぐには機能しません)。これは、LayoutParams がレイアウトシステム。正確な詳細を思い出そうとしていますが、これは LayoutParam サブクラスのさまざまなタイプと、MarginLayoutParam (またはそのサブクラス) のプロパティ (たとえば、marginLeft が ListView のレイアウト コードによって無視される可能性があるため) によるものだと思います。マージンのオプションを含まない AbsListView.LayoutParams のインスタンスを使用する必要があります。1 つの方法は、その LayoutParams* でマージンを許可するコンテナー View (サブクラス) 内に行をネストすることです。私はこの余分なネスティングをすることにはならなかったと確信していますが、私は'

ImageView を配置して、色で塗りつぶすことに言及しています。いくつかの代替案があります...おそらく、独自の ListRow クラスを定義し、onDraw() を使用して実際に行の内容を自分で描画し、canvas.draw_xyz() を使用して小さなカラー タブをペイントすることです。複合レイアウトで行を構築するのではなく、残りのテキストなどを描画します。レイアウトを使用する 2 番目の方法は、たとえば軽量の <View layout_height="match_parent" layout_width="4dip" background="#ffff0000" /> を使用することです。

* Android レイアウトの黄金律: 複雑な UI 階層は、特に ListView のようなものでは、パフォーマンスに悪影響を及ぼします。ビューを追加するのではなく、RelativeLayout、drawableTop(etc)、9-patch 画像などを使用することで、これを回避できることがよくあります。

私が誤解していて、上記があまりにも基本的なものである場合は、もう少し詳細を提供してください。おそらく、再現する必要がある正確な部分を示す図です.

于 2011-05-20T17:39:21.777 に答える
0

どうやってこのようなことを達成するのですか？

カフの外ではView、希望する背景色を使用し、必要なときに表示し、不要なときに非表示にします。

おまけに幅が交互になっていることもありますが、それはレイアウトの変更が小さいだけだと思います。

「交互幅」の意味がわかりません。Views水平方向に目的の背景色が 2 つあり、1 つだけが表示されていると思いLinearLayoutます。

そこに ImageView を挿入して、好きな色で塗りつぶすようなことができると思いますが、これは醜いハックだと思います。

うーん、ImageView必要以上に重い。そうでなければ、なぜこれがハックなのかわかりません。それらは、たまたま背が高く、薄く、灰色で、必ずしも必要ではないアイコンと考えてください。

もう 1 つの質問は、GMail またはメール アプリケーションが行うように、2 つの ListView フラグメントを何らかの方法で結合する一般化された方法があるかどうかです。

を使用してRelativeLayout、右側のフラグメントが左側のフラグメントの上に浮かぶようにします。

于 2011-05-20T17:01:10.277 に答える