إضافة أزرار أيقونات إلى Toolbar إلى تطبيق الأندرويد عبر ملف menu

بسم الله الرحمن الرحيم

السلام عليكم ورحمة الله وبركاته .

تدوينتا اليوم عن وضع أزرار على شكل أيقونات إلى Toolbar وهذا شيء مهم جدا لتصميم التطبيق ومظهره الجمالي .

وجل عملنا اليوم في ملف menu.xml وملف MainActivity.java .

أولا : الذهاب لملف menu داخل مجلد menu في res ( لكل أكتيفيتي ملف menu خاص به )

• لدينا اكتيفيتي اسميناها icon وهذا ملف menu الخاص بها :

<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    tools:context="com.dev.ms.test.icon">
    <item
        android:id="@+id/action_settings"
        android:orderInCategory="100"
        android:title="@string/action_settings"
        app:showAsAction="never" />
</menu>

ما يهمنا شيئان هما :

• المسؤول عن شكل ال item إما ك icon أو بشكل افتراضي ضمن ال list ( القائمة الافتراضية ) .

app:showAsAction="never"

والتي سنغيرها لتصبح على شكل أيقونة فتصبح هكذا :

app:showAsAction="ifRoom"

• ال icon لل item و هذه يجب كتابتها بأنفسنا .

android:icon="your icon resource"

وهنا ستضع مصدر الأيقونة من drawable , mipmap , ……

ولبرمجة حدث الضغط من ملف الجافا وهنا لدينا icon.java :

@Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            //your code
            return true;
        }

        return super.onOptionsItemSelected(item);
    }

عبر دالة onOptionsItemSelected الموجودة مسبقا عند إنشاء أي اكتيفيتي ,  نكتب الكود في مكان your code// وفي حال كان لدينا أكثر من item ننشأ جملة شرطية مع ال id الخاص بال item .

والآن المثال كاملا :

•  ملف ال menu :

<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    tools:context="com.dev.ms.test.icon">
    <item
        android:id="@+id/action_settings"
        android:orderInCategory="100"
        android:title="@string/action_settings"
        app:showAsAction="ifRoom"
        android:icon="@drawable/abc_ic_menu_share_mtrl_alpha"
        />
</menu>

الاختلاف في الايقونة هنا وهي أيقونة المشاركة الافتراضية المقدمة من أندرويد حيث تستطيع رؤيتها بكتابة a بعد /drawable حيث ستظهر كل الأيقونات.

• ملف الجافا :

package com.dev.ms.test;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.Toast;

public class icon extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_icon);
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_icon, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            Toast.makeText(icon.this, "بسم الله", Toast.LENGTH_SHORT).show();
            return true;
        }

        return super.onOptionsItemSelected(item);
    }
}

نتيجة المحاكاة ( مظهر ال Toolbar ) :

وعند الضغط على الأيقونة سينفذ الكود أما في حال الضغط مطولا سيتم عرض توست افتراضي بال string الخاص بال item وهذا الشيء افتراضي ولا نتدخل فيه .

ملاحظة : يمكنكم وضع عدة أيقونات بجانب بعضها بإضافة item بنفس الطريقة وبالنسبة للترتيب بالإمكان التحكم من خلال ملف menu بتغير مواقع الأكواد الخاصة بكل أيقونة لدينا .

انتهت تدوينتنا , دمتم في رعاية الله .

السلام عليكم ورحمة الله وبركاته .