تطبيق compteur de calories بأندرويد الجزء الأول

imadbelasri Android
AN

فهاد الدرس الجديد من سلسلة أندرويد غادي نشوفو كيفاش نقادو تطبيق compteur de calories فشنو كيدير هاد التطبيق جواب التطبيق كيحسب السعرات الحرارية لي خداها جسم المستخدم نتيجة بعض المأكولات فالمستخدم كيدخل شنو كلا بالإضافة للسعرة الحرارية لي كتزاد فقاعدة البيانات فهنا غادي نخدمو ب sql lite لي déjà intégré مع أندرويد من بعد المستخدم كيطلع على كل المأكولات ديالو بالإضافة لمجموع السعرات الحرارية كما عندو الإمكانية باش ي partager لمأكولات ديالو أو يمسحها.


نظرة سريعة بالفيديو


1- الملف activity_main.xml

فأول حاجة غادي نديرو غادي نزيدو project جديد ف android studio ختار Basic Activity سميه CalCounter من بعد ميتزاد غادي تمشي للمجلد res/layout فيه كاين ملف activity_main.xml هادا هو الملف ديال الصفحة الرئيسية ديالنا فيه الكود لي فيه textview غادي يكون فيها عنوان التطبيق منبعد عندي جوج edittext وحدة غادي يدخل فيها المستخدم سمية الأكلة  ووحدة السعرة الحرارية و bouton لي غادي تمكن من إضافة المعلومات فقاعدة البيانات الكود ديال activity_main.xml هو :


                                                    
                                                        <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:background="#e8eaf6"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="coml.jbarli.contact.calcounter.MainActivity">

    <TextView
        android:id="@+id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:textStyle="bold"
        android:textSize="40sp"
        android:textColor="#605b5b"
        android:text="@string/text_title" />
    <ImageView
        android:id="@+id/Apple"
        android:src="@drawable/apple"
        android:layout_centerHorizontal="true"
        android:layout_below="@+id/title"
        android:layout_marginTop="10dp"
        android:layout_width="200dp"
        android:layout_height="200dp" />
    <LinearLayout
        android:id="@+id/thumbnail"
        android:layout_below="@+id/Apple"
        android:orientation="vertical"
        android:layout_centerHorizontal="true"
        android:gravity="center_horizontal"
        android:background="@drawable/row_bg"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
        <EditText
            android:id="@+id/foodEditText"
            android:hint="@string/hint_food"
            android:padding="14dp"
            android:layout_marginTop="18dp"
            android:layout_width="250dp"
            android:layout_height="wrap_content" />
        <EditText
            android:id="@+id/CaloriesEditText"
            android:padding="14dp"
            android:hint="@string/hint_calories"
            android:inputType="number"
            android:layout_width="250dp"
            android:layout_height="wrap_content" />
        <Button
            android:id="@+id/submitButton"
            android:text="@string/submit"
            android:textColor="#000"
            android:layout_marginTop="20dp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </LinearLayout>
</RelativeLayout>

                                                    
                                                

2- الملف list_row.xml

فالمجلد res/layout فيه زيد ملف جديد سميه list_row.xml فيه غادي يكونوا العناصر لي كيكونوا ال listview لي غادي يتعرضوا فيها المعلومات الخاصين بكل أكلة دخلها المستخدم فهنا عندنا des textview لي غادي ياخدو الإسم التاريخ فوقاش تزادت الصورة والسعرات بالإضافة لواحد السهم لي غادي يمكن من الإطلاع على تفاصيل الأكلة الكود ديال الملف هو:

                                                        
                                                            <?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="match_parent"
    android:background="@drawable/row_bg">
    <TextView
        android:id="@+id/foodName"
        android:text="Aliment"
        android:textColor="#242424"
        android:textSize="30sp"
        android:layout_marginTop="30dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true" />
    <TextView
        android:id="@+id/dateText"
        android:text="Date"
        android:textColor="#242424"
        android:textStyle="italic"
        android:layout_marginTop="20dp"
        android:textSize="20sp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/foodName"
        android:layout_alignRight="@+id/imageView"
        android:layout_alignEnd="@+id/imageView" />
    <ImageView
        android:id="@+id/imageView"
        android:src="@drawable/apple"
        android:layout_below="@+id/dateText"
        android:layout_marginTop="20dp"
        android:layout_centerHorizontal="true"
        android:layout_width="90dp"
        android:layout_height="90dp" />
    <TextView
        android:id="@+id/calories"
        android:textStyle="bold"
        android:text="120"
        android:textSize="25sp"
        android:layout_below="@+id/imageView"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="20dp"
        android:textColor="#FF0024"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
    <TextView
        android:id="@+id/calText"
        android:text="Cal."
        android:textColor="#242424"
        android:textStyle="bold"
        android:textSize="15sp"
        android:layout_alignBaseline="@+id/calories"
        android:layout_toRightOf="@+id/calories"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />
    <TextView
        android:id="@+id/superieur"
        android:textColor="#242424"
        android:textSize="50sp"
        android:textStyle="bold"
        android:text=">"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignTop="@+id/calories"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true" />
</RelativeLayout>
                                                        
                                                    

3- الملف activity_display_food.xml

فالمجلد java  فيه كنزيد Activity جديدة سميها DisplayFood منبعد متزاد سير ل res/layout فيه غادي تلقا ملف سميتو activity_display_food.xml فيه كاين des textviews لي كياخدو شحال من أكلة تزادت وايضا شحال دالسعرات وكاين أيضا listview لي غادي تعرض داكشي لي كلا المستخدم الكود ديال الملف هو:

                                                        
                                                            <RelativeLayout 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:background="#e8eaf6"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    tools:context="app.calcounterapplication.com.calcounter.DisplayFoodsActivity">
    <LinearLayout
        android:id="@+id/linearLayout"
        android:background="#00ACC1"
        android:paddingBottom="12dp"
        android:paddingTop="12dp"
        android:orientation="horizontal"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content">
        <TextView
            android:id="@+id/totalAmountTextView"
            android:textColor="#fff3f6ff"
            android:textStyle="bold"
            android:layout_marginLeft="4dp"
            android:paddingRight="10dp"
            android:text="@string/total_calories"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
        <TextView
            android:text="|"
            android:textColor="#ffee1d27"
            android:textSize="27sp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
        <TextView
            android:id="@+id/totalItemsTextView"
            android:textColor="#ff212121"
            android:textStyle="bold"
            android:textSize="13sp"
            android:layout_marginLeft="5dp"
            android:text="@string/food_item_num"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </LinearLayout>
    <ListView
        android:id="@+id/list"
        android:layout_below="@+id/linearLayout"
        android:dividerHeight="2dp"
        android:divider="#212121"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"></ListView>
</RelativeLayout>

                                                        
                                                    

4- الملف activity_display_item_food_details.xml

فالمجلد java  فيه كنزيد Activity جديدة سميها DisplayItemFoodDetails منبعد متزاد سير ل res/layout فيه غادي تلقا ملف سميتو activity_display_item_food_details.xml فيه كاين des textviews لي كياخدو المعلومات ديال الأكلة لي اختار المستخدم يشوف بالإضافة لles boutons لي كيمكنوا من حدف أو partage ديال هاد الأكلة الكود ديال الملف هو:

                                                        
                                                            <RelativeLayout 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:background="#e8eaf6"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    tools:context="app.calcounterapplication.com.calcounter.FoodItemDetailsActivity">
    <ImageView
        android:id="@+id/logo"
        android:src="@drawable/apple"
        android:layout_centerHorizontal="true"
        android:layout_width="180dp"
        android:layout_height="180dp" />
    <LinearLayout
        android:id="@+id/layout"
        android:layout_below="@+id/logo"
        android:background="@drawable/row_bg"
        android:orientation="vertical"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">
        <TextView
            android:id="@+id/detsFoodName"
            android:text="dkdad"
            android:textSize="19sp"
            android:layout_marginTop="28dp"
            android:layout_gravity="center"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
        <TextView
            android:id="@+id/detsCaloriesTitle"
            android:text="Calories:"
            android:textSize="18sp"
            android:layout_gravity="center_horizontal"
            android:layout_marginTop="10dp"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
        <TextView
            android:id="@+id/detsCaloriesValue"
            android:text="200"
            android:textSize="18sp"
            android:layout_marginTop="18dp"
            android:layout_gravity="center_horizontal"
            android:textStyle="bold"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
        <TextView
            android:id="@+id/detsDateText"
            android:text="Consumed on.."
            android:textStyle="italic"
            android:textSize="14sp"
            android:layout_marginTop="14dp"
            android:layout_gravity="center_horizontal"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
        <Button
            android:id="@+id/detsShareButton"
            android:text="@string/share"
            android:layout_gravity="right"
            android:background="@drawable/circle"
            android:layout_marginTop="65dp"
            android:layout_width="80dp"
            android:layout_height="80dp" />
        <Button
            android:id="@+id/deleteButton"
            android:text="@string/delete_item"
            android:layout_marginTop="-80dp"
            android:layout_gravity="left"
            android:background="@drawable/circle"
            android:layout_width="80dp"
            android:layout_height="80dp" />
    </LinearLayout>
</RelativeLayout>