menusearch
javapro.ir

جلسه بیستم (آخر) | ساخت برنامه شبیه به اینستاگرام | کامل کردن صفحه کاربر

جستجو
شنبه ۸ مهر ۱۴۰۲ | ۱۷:۲۷:۳۹
۱۳۹۹/۸/۱۴ چهارشنبه
(4)
(0)
جلسه بیستم (آخر) | ساخت برنامه شبیه به اینستاگرام | کامل کردن صفحه کاربر
جلسه بیستم (آخر) | ساخت برنامه شبیه به اینستاگرام | کامل کردن صفحه کاربر

آموزش پروژه محور ساخت شبکه اجتماعی شبیه اینستاگرام

 

 

به نام خدا

 

آموزش برنامه نویسی اندروید
آموزش پروژه محور ساخت اینستاگرام
موضوع:پیاده سازی صفحه جستجو
جلسه: بیستم (جلسه آخر)
مدرس : محمد مهدی طاهری

 


عرض سلام و وقت بخیر خدمت همه شما کاربران عزیز سایت جاواپرو
امیدوارم حالتون خوب باشه و ایام به کامتون باشه
دوره اینستاگرام هم بالاخره به ایستگاه اخر خودش رسید
بریم و شروع کنیم.


این جلسه میخوایم صفحه مشخصات کاربر یا همون UserFragment رو تکمیل کنیم.
قبلش باید لیست پست هایی که کاربر پست کرده رو طراحی کنیم.


پس میریم به user_fragment.xml و یه ریسایکلر ویو زیر دکمه edit profile قرار میدیم
بنده یکدفعه کل کد این لایه رو که از ابتدا کامل کردیم میذارم:

 

<FrameLayout 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="#ffffff"
  tools:context=".fragments.HomeFragment">

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

      <LinearLayout
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:layout_marg into p="12dp"
          android:gravity="center"
          android:orientation="horizontal"
          android:padding="10dp">

          <com.github.abdularis.civ.CircleImageView
              android:id="@+id/circle_user_image"
              android:layout_width="80dp"
              android:layout_height="80dp"
              android:src="@mipmap/userimage"></com.github.abdularis.civ.CircleImageView>

          <LinearLayout
              android:layout_width="0dp"
              android:layout_height="match_parent"
              android:layout_weight="1"
              android:gravity="center"
              android:orientation="vertical">

              <TextView
                  android:id="@+id/numofposts"
                  android:layout_width="match_parent"
                  android:layout_height="wrap_content"
                  android:gravity="center"
                  android:hint="0"
                  android:text="TextView"
                  android:textColor="#000000"
                  android:textColorHint="#000000"
                  tools:text="0" />

              <TextView
                  android:id="@+id/textView"
                  android:layout_width="match_parent"
                  android:layout_height="wrap_content"
                  android:gravity="center"
                  android:text="Posts"
                  android:textColor="#000000"
                  android:textSize="18sp"
                  android:textStyle="bold" />

          </LinearLayout>

          <LinearLayout
              android:layout_width="0dp"
              android:layout_height="match_parent"
              android:layout_weight="1"
              android:gravity="center"
              android:orientation="vertical">

              <TextView
                  android:id="@+id/numoffollower"
                  android:layout_width="match_parent"
                  android:layout_height="wrap_content"
                  android:gravity="center"
                  android:text="TextView"
                  android:textColor="#000000"
                  tools:text="0" />

              <TextView
                  android:id="@+id/textView4"
                  android:layout_width="match_parent"
                  android:layout_height="wrap_content"
                  android:gravity="center"
                  android:text="Followers"
                  android:textColor="#000000"
                  android:textSize="18sp"
                  android:textStyle="bold" />

          </LinearLayout>

          <LinearLayout
              android:layout_width="0dp"
              android:layout_height="match_parent"
              android:layout_weight="1"
              android:gravity="center"
              android:orientation="vertical">

              <TextView
                  android:id="@+id/numoffollowing"
                  android:layout_width="match_parent"
                  android:layout_height="wrap_content"
                  android:gravity="center"
                  android:text="TextView"
                  android:textColor="#000000"
                  tools:text="0" />

              <TextView
                  android:id="@+id/textView5"
                  android:layout_width="match_parent"
                  android:layout_height="wrap_content"
                  android:gravity="center"
                  android:text="Following"
                  android:textColor="#000000"
                  android:textSize="18sp"
                  android:textStyle="bold" />

          </LinearLayout>
      </LinearLayout>

      <LinearLayout
          android:layout_width="match_parent"
          android:layout_height="0dp"
          android:layout_weight="1"
          android:orientation="vertical"
          android:padding="10dp">

          <TextView
              android:id="@+id/txtname"
              android:layout_width="match_parent"
              android:layout_height="0dp"
              android:layout_weight="1"
              android:gravity="left"
              android:text="TextView"
              android:textColor="#000000"
              android:textStyle="bold" />

          <TextView
              android:id="@+id/txtbio"
              android:layout_width="match_parent"
              android:layout_height="0dp"
              android:layout_weight="2"
              android:text="TextView"
              android:textColor="#000000" />

          <Button
              android:id="@+id/btneditprofile"
              android:layout_width="match_parent"
              android:layout_height="0dp"
              android:layout_weight="1"
              android:background="@drawable/btneditbg"
              android:text="Edit Profile" />
      </LinearLayout>

      <LinearLayout
          android:layout_width="match_parent"
          android:layout_height="0dp"
          android:layout_weight="2"
          android:orientation="vertical">


          <android.support.v7.widget.RecyclerView
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:id="@+id/rec_view"></android.support.v7.widget.RecyclerView>
      </LinearLayout>

  </LinearLayout>

</FrameLayout>


نمونه کد 1

 


توی UserFragment.java هم یک شی از ریسایکلر ویو میسازیم و اون رو تعریف میکنیم به این شکل:

 

recyclerView = v.findViewById(R.id.rec_view);

 

نمونه کد 2

 


حالا یک لایه جدید ایجاد میکنیم تحت عنوان user_post.xml به عنوان لایه ای که قرار به صورت لیست تکرار بشه و به این صورت طراحی میکنیم:

 

<android.support.v7.widget.CardView
  xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"
  android:layout_height="wrap_content">
<ImageView
  android:layout_width="match_parent"
  android:layout_height="150dp"
  android:scaleType="fitXY"
  android:id="@+id/img_post_user"></ImageView>
</android.support.v7.widget.CardView>


نمونه کد 3

 

حالا بریم و یک holder و یک adapter هم برای تبدیل پست ها به لیست بسازیم
یه کلاس جدید ایجاد میکنیم به اسم User_post_holder و بدین صورت طراحی میکنیم:

 

public class User_post_holder extends RecyclerView.ViewHolder {
  ImageView image;
  public User_post_holder(@NonNull View itemView) {
      super(itemView);
      image=itemView.findViewById(R.id.img_post_user);
  }
}


نمونه کد 4


حالا یک اداپتر لازم داریم که ویومون را به لیست اداپت کنه
یک کلاس جدید به اسم User_post_adapter میسازیم و به این شکل برنامه نویسی میکنیم:

 

public class User_post_adapter extends RecyclerView.Adapter<User_post_holder> {
  Context context;
  List<String> images;
  LayoutInflater inflater;
  public User_post_adapter(Context context, List<String> images) {
      this.context=context;
      this.images=images;
      inflater=inflater. from (context);
  }

  @NonNull
  @Override
  public User_post_holder onCreateViewHolder(@NonNull ViewGroup viewGroup, int i) {

      View view=inflater.inflate(R.layout.user_post,viewGroup,false);
      User_post_holder post_holder=new User_post_holder(view);
      return post_holder;

  }

  @Override
  public void onBindViewHolder(@NonNull User_post_holder user_post_holder, int i) {

      Picasso.get().load(Server.server_address+images.get(i)). into (user_post_holder.image);

  }

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


نمونه کد 5


حالا میریم به UserFragment.java و چندتا متغیر تعریف میکنیم:

 

RecyclerView recyclerView;
User_post_adapter adapter;
List<String> images;
RequestQueue queue;
GridLayoutManager layoutManager;
SharedPreferences preferences;


نمونه کد 6


بعد name و bio رو که قبلا توی sharedprefrences ذخیره کردیم رو روی متغیر ها ست کنیم به این شکل:

 

preferences = getActivity().getSharedPreferences("shp", Context.MODE_PRIVATE);
name.setText(preferences.getString("fullname", null));
bio.setText(preferences.getString("bio", null));


نمونه کد 7

 


به ریسایکر ویو یک girdlayout میسازیم که پست ها رو به شکل gird لیست کنیم به این شکل:

 

layoutManager = new GridLayoutManager(getContext(), 3);
images = new ArrayList<>();
adapter = new User_post_adapter(getContext(), images);
recyclerView.setLayoutManager(layoutManager);
recyclerView.setAdapter(adapter);


نمونه کد 8


حالا باید برای RequestQueue یک نمونه ایجاد کنیم و که بتونیم یک درخواست به سرور ایجاد کنیم:

 

queue = Volley.newRequestQueue(getContext());


نمونه کد 9


حالا یک متد ایجاد میکنیم و درخواستمون رو به سرور میفرستیم تا پست ها رو دریافت کنیم
من کل کد متد رو اینجا قرار میدم چون شما بعد از 20 جلسه قطعا به ریکوئست دادن به سرور مسلط شدید.


  • به دلیل حجم بالای محتوا، ادامه جلسه بیستم(آخر) آموزش ساخت شبکه اجتماعی شبیه به اینستاگرام رو به صورت کامل در زیر دانلود کنید.

 

امید است افرادی که از تمکن مالی برخوردار هستند برای بقای سایت جاواپرو و رایگان ماندن آموزش ها از سایت جاواپرو حمایت مالی کنند.

 

 


ادامه حیات سایت جاواپرو به حمایت مالی (دونیت) از طرف شما کاربر عزیز بستگی دارد....



لینک دانلود آموزش رایگان اندروید

لینک دانلود جلسه بیستم(آخر) آموزش ساخت برنامه شبیه به اینستاگرام

 

 

عضویت در کانال تخصصی آموزش جاوا و اندروید در تلگرام

با عضویت در کانال تخصصی برنامه نویسی جاوا و اندروید جاواپرو از ما حمایت کنید

 

نظرات کاربران
*نام و نام خانوادگی
* پست الکترونیک
* متن پیام

بستن
*نام و نام خانوادگی
* پست الکترونیک
* متن پیام

2 نظر
مرتضی عنایتی
جمعه سوم تیر ۰۱
پاسخ
()
()
مرتضی عنایتی
سلام از سايت جاواپرو بسيار ممنون و سپاسگذارم بخاطر قرار دادن آموزش بسيار عالي و پروژه محور و مهمتر از اون رايگان
فرهود شیرزاد
یکشنبه سیزدهم تیر ۰۰
پاسخ
()
()
فرهود شیرزاد
سلام اول از همه ممنون بابت آموزش خوب و مفيد شما بزرگواران عزيز سايت پر محتوا جاواپرو من يه درخواست داشتم اي کاش اين آموزش رو بصورت ويديويي ارائه ميکرديد.. اگر امکانش هست اين آموزش رو بصورت فيلم قرار بدبد يا اينکه هزينه اون رو پرداخت ميکنم و برام ارسال کنيد
هدر سایت
زودتر از دیگران از جدیدترین مطالب آموزشی برنامه نویسی جاواپرو اطلاع پیدا کن
 شاید برای شما کم اهمیت باشد; اما حمایت مالی به جاواپرو جان می‌دهد
سوالات متداول برنامه نویسی
گفتگو را شروع کنید
مشاوره ،تدریس خصوصی و سفارش انجام انواع پروژه های برنامه نویسی