2016-03-19 15 views
0

NavigationViewのトグルボタンまたは少なくともチェックボックスを使用して、そこからのコントロール通知の機能(オン/オフ)を使用します。Android NavigationViewメニュートグルボタン

"menu.xml"ファイルの助けを借りてレイアウトが行われました。

checkable="true"を追加しようとしましたが、何も表示されません。 実装方法

<group android:checkableBehavior="single"> 
     <item 
      android:id="@+id/profile" 
      android:icon="@drawable/ic_account_grey600_48dp" 
      android:title="@string/profile" /> 
     <item 
      android:id="@+id/tutorial" 
      android:icon="@drawable/ic_help_grey600_48dp" 
      android:title="@string/tutorial" /> 
<item 
    android:id="@+id/checkable_menu" 
    android:checkable="true" 
    android:title="@string/haircut_notifications" /> 

    </group> 

    <group 
     android:id="@+id/menu_bottom" 
     android:checkableBehavior="none"> 
     <item 
      android:id="@+id/nav_share" 
      android:icon="@drawable/ic_share_variant_grey600_48dp" 
      android:title="@string/share" /> 
     <item 
      android:id="@+id/selfie_videos" 
      android:icon="@drawable/ic_camera_front_variant_grey600_48dp" 
      android:title="@string/selfie_videos" /> 
    </group> 

</menu> 

編集:私は達成したいだけのようトグルでGoogle Mで

リトル例。

これを行うにはどうすればよいですか?代わりにメニューを使用リサイクラービューの

enter image description here

+1

NavigationViewはアプリ内とアプリ内でのナビゲーション用ですので、何かを切り替えるために使用することは期待していません。ただし、アクションバーのメニュー項目をチェック可能なトグルとして使用するのが一般的です。 –

+0

@DougStevenson質問を更新しました。 もう一度画像を確認してください。そうするのが良い方法ではないと確信できますか? –

+0

この実装に満足している場合は、ぜひともそれをお試しください。それは慣習的ではないようですが、多分それは関係ありませんか? –

答えて

1

app:actionLayout = "@ layout/item"を試してみてください。item.xmlはトグルボタンを置く場所です。

<menu xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto"> 

<item android:title="@string/settings_info"> 
     <menu> 

    <item android:id="@+id/nav_number" 
      android:icon="@drawable/ic_room" 
      android:title="@string/number" 
      app:actionLayout="@layout/item"/> 

    </item> 

</menu> 


/*How to handle the click event*/ 
@Override public boolean onNavigationItemSelected(MenuItem item) { 

// Handle navigation view item clicks. 
    switch (item.getItemId()){ 
     case R.id.nav_network: 
      startActivity(new Intent(this, NetworkActivity.class)); break; 
    } 

    DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout); 
    drawer.closeDrawer(GravityCompat.START); 
    return true; 
} 
+0

ありがとう!それは素晴らしいことです! –

+0

そしておそらくあなたはこのアプリで正確にonclickを処理する方法を知っています:actionLayoutアイテム? –

+0

このメソッドをオーバーライドする必要があります.NavigationItemSelectedを次の例に示します。 @Override public boolean onNavigationItemSelected(MenuItem item){ //ナビゲーションビューアイテムのクリックを処理します。 スイッチ(item.getItemId()){ 場合R.id.nav_network: startActivity(新しいインテント(この、NetworkActivity.class))。 休憩。 } DrawerLayout drawer =(DrawerLayout)findViewById(R.id.drawer_layout); drawer.closeDrawer(GravityCompat.START); がtrueを返します。 } –

2

あなたはアイテムの上に、より多くのコントロールを持つように。以下のコードはテスト済みで動作しています。

これが出している: ScreenShot

ステップ1:項目のレイアウトを作成します。

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="match_parent" 
android:layout_height="wrap_content" 
android:orientation="horizontal"> 

<ImageView 
    android:id="@+id/image" 
    android:layout_marginLeft="16dp" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:src="@mipmap/ic_launcher" /> 

<TextView 
    android:id="@+id/text" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_gravity="center_vertical" 
    android:layout_marginLeft="16dp" 
    android:text="Title" /> 

</LinearLayout> 

item_normal.xml何も空想だけで画像とテキスト

ステップ2 :トグルレイアウトでitem_toggle.xmlを作成できるようにする

item_toggle.xml

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="match_parent" 
android:layout_height="wrap_content" 
android:orientation="horizontal"> 

<TextView 
    android:id="@+id/textCustom" 
    android:layout_marginLeft="16dp" 
    android:layout_centerVertical="true" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:text="Notifications" /> 

<ToggleButton 
    android:layout_marginRight="16dp" 
    android:id="@+id/toggleButton" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_alignParentEnd="true" 
    android:layout_alignParentRight="true" 
    android:text="New ToggleButton" /> 
</RelativeLayout> 

ステップ3:私たちのナビゲーションビュー内

CustomAdapter.java

public class CustomAdapter extends RecyclerView.Adapter { 

String Tag = CustomAdapter.class.getSimpleName(); 

private final int NORMAL_VIEW = 88; // code for normal view type 
private final int CUSTOM_VIEW = 99; //code for loader type 

private Context context; 
private ArrayList<Model> listingData = new ArrayList<>(); 

public CustomAdapter(Context context) { 
    this.context = context; 
} 

@Override 
public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) { 

    LayoutInflater inflater = LayoutInflater.from(parent.getContext()); 

    if (viewType == NORMAL_VIEW) { 

     View normalView = inflater.inflate(R.layout.item_normal, parent, false); 
     return new NormalItem(normalView); 

    } else if (viewType == CUSTOM_VIEW) { 

     View customView = inflater.inflate(R.layout.item_toogle, parent, false); 
     return new CustomItem(customView); 
    } else return null; // unknown type. 
} 

@Override 
public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) { 

    if (holder instanceof NormalItem) { 
     // normal list item. 
     ((NormalItem) holder).textView.setText(listingData.get(position).getName()); 
     ((NormalItem) holder).icon.setImageResource(R.mipmap.ic_launcher); 

    } else if (holder instanceof CustomItem) 
    { 
     ((CustomItem) holder).textViewToggle.setText("On"); 
     ((CustomItem) holder).textViewToggle.setText("Notifications"); 
    } 
} 

@Override 
public int getItemCount() { 
    return listingData.size(); 
} 

@Override 
public int getItemViewType(int position) { 

    if (position == 3) return CUSTOM_VIEW; 
    else return NORMAL_VIEW; 
} 

public class NormalItem extends RecyclerView.ViewHolder { 

    ImageView icon; 
    TextView textView; 

    public NormalItem(View itemView) { 
     super(itemView); 

     icon = (ImageView) itemView.findViewById(R.id.image); 
     textView = (TextView) itemView.findViewById(R.id.text); 

    } 
} 

public class CustomItem extends RecyclerView.ViewHolder { 

    ToggleButton toggleButton; 
    TextView textViewToggle; 

    public CustomItem(View itemView) { 
     super(itemView); 

     toggleButton = (ToggleButton) itemView.findViewById(R.id.toggleButton); 
     textViewToggle = (TextView) itemView.findViewById(R.id.textCustom); 

    } 
} 


/** 
* method to update the adapter and notify the adapter item by item 
* 
* @param data data to be updated. 
*/ 
public void updateAdapter(ArrayList<Model> data) { 

    try { 
     for (Model item : data) { 
      listingData.add(item); 
      notifyItemInserted(getItemCount() - 1); 
     } 
    } catch (Exception e) { 
     Log.e(Tag, e.toString() + ""); 
    } 

} 
} 

ステップ4になるだろう私たちのリサイクルビュー用のアダプタを作成することができます:作成しますactivity_main.xml

activity_main.xml

<?xml version="1.0" encoding="utf-8"?> 
<android.support.design.widget.CoordinatorLayout    xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:tools="http://schemas.android.com/tools" 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
android:fitsSystemWindows="true" 
tools:context=".main.MainActivity"> 


<android.support.v4.widget.DrawerLayout 
    android:id="@+id/drawerLayout" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:fitsSystemWindows="true" 
    tools:openDrawer="start"> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:orientation="vertical"> 

     <include layout="@layout/toolbar" /> 

    </LinearLayout> 

    <android.support.design.widget.NavigationView 
     android:id="@+id/navigationView" 
     android:layout_width="wrap_content" 
     android:layout_height="match_parent" 
     android:layout_gravity="start"> 

     <android.support.v7.widget.RecyclerView 
      android:layout_marginTop="16dp" 
      android:id="@+id/recyclerView" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:scrollbars="vertical" /> 


    </android.support.design.widget.NavigationView> 
</android.support.v4.widget.DrawerLayout> 

ステップ5:

<?xml version="1.0" encoding="utf-8"?> 
<android.support.v7.widget.Toolbar  xmlns:android="http://schemas.android.com/tools" 
xmlns:app="http://schemas.android.com/apk/res/android" 
app:id="@+id/toolbar" 
android:elevation="4dp" 
app:layout_width="match_parent" 
app:layout_height="wrap_content" 
app:background="?attr/colorPrimary" 
app:popupTheme="@style/ThemeOverlay.AppCompat.Light" 
app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" 
android:background="?attr/colorPrimary" 
/> 

最終ステップ:MainActiivtyを作成し、当社のデータを保持する

Model.java

public class Model { 

public String getName() { 
    return name; 
} 

public void setName(String name) { 
    this.name = name; 
} 

public int getItem() { 
    return item; 
} 

public void setItem(int item) { 
    this.item = item; 
} 

String name; 
int item; 
} 

ステップ6を単純なクラスを作成することができます.class

MainActivity。クラス

public class MainActivity extends AppCompatActivity { 

private DrawerLayout drawerLayout; 
private RecyclerView recyclerView; 
private ArrayList<Model> data; 



@Override 
protected void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.activity_main); 
    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar); 
    setSupportActionBar(toolbar); 
    getSupportActionBar().setTitle("Custom Nav "); 
    drawerLayout = (DrawerLayout) findViewById(R.id.drawerLayout); 
    NavigationView navigationView = (NavigationView) findViewById(R.id.navigationView); 

    ActionBarDrawerToggle mToogle = new ActionBarDrawerToggle(this, drawerLayout, toolbar, R.string.app_name, R.string.app_name); 
    drawerLayout.addDrawerListener(mToogle); 
    mToogle.syncState(); 

    recyclerView = (RecyclerView) findViewById(R.id.recyclerView); 
    LinearLayoutManager manager = new LinearLayoutManager(this); 
    recyclerView.setLayoutManager(manager); 

    CustomAdapter adapter = new CustomAdapter(this); 
    recyclerView.setAdapter(adapter); 

    data = new ArrayList<>(); 

    Model item1 = new Model(); 
    item1.setName("Option 1"); 
    item1.setItem(R.mipmap.ic_launcher); 

    Model item2 = new Model(); 
    item2.setName("Option 2"); 
    item2.setItem(R.mipmap.ic_launcher); 

    Model item3 = new Model(); 
    item3.setItem(R.mipmap.ic_launcher); 
    item3.setName("Option 3"); 

    Model item4 = new Model(); 
    item4.setItem(R.mipmap.ic_launcher); 
    item4.setName("Option 4"); 


    data.add(item1); 
    data.add(item2); 
    data.add(item3); 
    data.add(item4); 
    adapter.updateAdapter(data); 
} 

} 

あなたのニーズに応じて、ヘッダーを追加して磨くことができます。それが役に立てば幸い。 ハッピーコーディング。

+0

ありがとう!あなたはこのコードでこのビューを達成し、@ Arturo Mejiaの答えはただ1つのmenu_item –

+0

と私はそれを、より良い、少ないコードを見た。より多くのスタイリングのようなコントロールが必要な場合は、これを使用することができます。 – Irfan

関連する問題