web-dev-qa-db-ja.com

アイコンをAndroidナビゲーションドロワーに追加しますか？

私はこの質問への答えをウェブで探しましたが、公式のAndroidドキュメントでも、答えが見つからないようです。

Androidの新しいNavigationDrawerレイアウトを実装するアプリを作成中です。このレイアウトのドキュメントは ここ および ここ にあります。

デザインドキュメントや、FacebookやGoogle Currentsなどの多くの人気のあるアプリでは、ドロワーアイテムの前にアイコンがあります。

設計ドキュメント自体は、「ナビゲーションドロワーのコンテンツ」の下にそれらについて言及しています。

ナビゲーションターゲットには、オプションの先頭アイコンと末尾カウンターを含めることができます。カウンターを使用して、対応するビューのデータの変更された状態についてユーザーに通知します。

残念ながら、開発者向けドキュメントには、このセットアップでアイコンを実装する方法については記載されていません。アイテムのリストを次のように実装する方法について説明します。

public class MainActivity extends Activity {
private String[] mPlanetTitles;
private ListView mDrawerList;
...

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    mPlanetTitles = getResources().getStringArray(R.array.planets_array);
    mDrawerList = (ListView) findViewById(R.id.left_drawer);

    // Set the adapter for the list view
    mDrawerList.setAdapter(new ArrayAdapter<String>(this,
            R.layout.drawer_list_item, mPlanetTitles));
    // Set the list's click listener
    mDrawerList.setOnItemClickListener(new DrawerItemClickListener());

    ...
}
}

それらの実装はgetStringArray（）を使用するため、アイコンを含むように行アイテムのxmlを変更することを考える方法はありません。

多くのアプリは各テキストアイテムの前にアイコンを実装しているように見え、デザインドキュメントではアイコンの追加についても言及しているため、これは厄介です。これらのアイコンを追加するには、簡単なAPI呼び出しが必要だと思いますが、これまでに見つけた唯一の実装は、途方もなく複雑に思えます。

ナビゲーションドロワーアイテムにアイコンを追加する方法を知っている人はいますか？単純なAPI呼び出しでこれを行う方法はありますか、またはこれらすべての企業（Facebook、Googleなど）が問題をハックする方法を見つけなければなりませんでしたか？

みんな、ありがとう。

androidandroid-layouticons
17
bean

それらの実装はgetStringArray（）を使用するため、アイコンを含むように行アイテムのxmlを変更することを考える方法はありません。

ListAdapterのモデルデータの選択は、そのListAdapterによって作成された行にアイコンを含めることができるかどうかにはまったく影響しません。

ナビゲーションドロワーアイテムにアイコンを追加する方法を知っている人はいますか？

ImageViewの行レイアウトにListAdapterを配置します。 ImageViewのgetView()をオーバーライドするなどして、ListAdapterを介してそのArrayAdapterにデータを入力します。 IOW、何年にもわたって行われているように、他のListViewの場合と同じ方法でそれを行います。

簡単なAPI呼び出しでこれを行う方法はありますか

これは、「単純」と「API呼び出し」の定義によって異なります。

7
CommonsWare

のようなアダプタクラスを作成します。

public class AdapterClass  extends ArrayAdapter<String> {
Context context;
private ArrayList<String> TextValue = new ArrayList<String>();

public AdapterClass(Context context, ArrayList<String> TextValue) {
    super(context, R.layout.row_of_drawer, TextValue);
    this.context = context;
    this.TextValue= TextValue;

}


@Override
public View getView(int position, View coverView, ViewGroup parent) {
    // TODO Auto-generated method stub

    LayoutInflater inflater = (LayoutInflater) context
            .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    View rowView = inflater.inflate(R.layout.row_of_drawer,
            parent, false);

    TextView text1 = (TextView)rowView.findViewById(R.id.text1);
    text1.setText(TextValue.get(position));

    return rowView;

}

}

そして、MainActivityの変更を作成します。

使用する

   AdapterClass adClass = new AdapterClass(MainActivity.this, name_of_arrayList);

    mDrawerList.setAdapter(adClass);

の

 mDrawerList.setAdapter(new ArrayAdapter<String>(this,
        R.layout.drawer_list_item, mPlanetTitles));
4
TKumar

これを本当に明確に構造化するために、NavigationItemsの配列からすべてを生成するオブジェクト指向実装のコードを数行追加しました-テキストのフィールドを含むプレーンなJavaクラス） 、アイコンおよびメニュー項目のフラグメント：

MainActivityでは、ナビゲーションは単純に配列によって定義されます。

NavigationAdapter navigationMenuAdapter;
NavigationItem[] navigationMenuItems = {
    new NavigationItem(R.string.menu_home, R.drawable.ic_menu_home, new MainFragment()),
    new NavigationItem(R.string.menu_statistics, R.drawable.ic_statistics, new StatisticsFragment()),
    new NavigationItem(R.string.menu_settings, R.drawable.ic_settings, new SettingsFragment()),
};

protected void onCreate(Bundle savedInstanceState) {
    ...
    navigationMenuAdapter = new NavigationAdapter(this, navigationMenuItems);
    mDrawerList.setAdapter(navigationMenuAdapter);
}

...
private void selectItem(int position) {
    // Insert the fragment by replacing any existing fragment
    FragmentManager fragmentManager = getFragmentManager();
    fragmentManager.beginTransaction()
                   .replace(R.id.content_frame, navigationMenuItems[position].fragment)
                   .commit();

    mDrawerList.setItemChecked(position, true);
    setTitle(navigationMenuItems[position].stringTitle);
    mDrawerLayout.closeDrawer(mDrawerList);
}

NavigationItemクラス：

public class NavigationItem
{
    /**
     * 
     * @param stringTitle The id of the string resource of the text of the item.
     * @param drawableIcon The id of the drawable resource of icon of the item.
     * @param fragment The Fragment to be loaded upon selecting the item.
     */
    public NavigationItem(int stringTitle, int drawableIcon, Fragment fragment)
    {
        this.stringTitle = stringTitle;
        this.drawableIcon = drawableIcon;
        this.fragment = fragment;
    }

    /**
     * The id of the string resource of the text of the item.
     */
    public int stringTitle;

    /**
     * The id of the drawable resource of icon of the item.
     */
    public int drawableIcon;

    /**
     * The Fragment to be loaded upon selecting the item.
     */
    public Fragment fragment;
}

そしてNavigationAdapter：

public class NavigationAdapter extends BaseAdapter {
    private Context context;
    private NavigationItem[] navigationItems;

    public NavigationAdapter(Context context, NavigationItem[] items) {
        this.context = context;
        navigationItems = items;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        View row = null;
        if (convertView == null) {
            LayoutInflater inflater = (LayoutInflater) context
                .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            row = inflater.inflate(R.layout.list_item_navigation, parent, false);
        } else {
            row = convertView;
        }

        TextView tvTitle = (TextView) row.findViewById(R.id.textView);
        ImageView ivIcon = (ImageView) row.findViewById(R.id.imageView);

        tvTitle.setText(navigationItems[position].stringTitle);
        ivIcon.setImageResource(navigationItems[position].drawableIcon);
        return row;
    }
}

これは非常に基本的なxmlレイアウトを使用しますlist_item_navigation、これにはImageViewとTextViewのみが含まれます。

2
sleidig

文字列配列は、行のレイアウトを定義するものではありません。 _R.layout.drawer_list_item_は、リストの各行のレイアウトを表します。画像（または他の複雑な行レイアウト）を含める場合は、_R.layout.drawer_list_item_ xmlを置き換えるカスタムレイアウトxmlに画像ビューを含めます。

画像やテキストをそれぞれの異なる行に設定する方法については、これはすべて配列アダプタのgetView()メソッドで行われます。大まかな例は次のようなものです（行にtextviewとimageviewがあると仮定します）：

_@Override
public View getView(int position, View convertView, ViewGroup parent) {

    LayoutInflater inflater = (LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    convertView = inflater.inflate(R.layout.revise_listview, parent,false);

    TextView tv = (TextView)convertView.findViewById(R.id.text);
    ImageView iv = (ImageView)convertView.findViewById(R.id.image);

    tv1.setText(stringArray.get(i));
    if(//condition) {
        iv.setImageResource(R.drawable.imagexx);
    }
    return convertView;
}
_

各行のビューを実装するためのより効率的な方法は、ビューホルダーパターンを使用することです。例を見つけることができる多くの場所の1つは ここ です。

2
Neoh