JavaPro

خلاصه مطلب

دوره 200 هزار تومانی ساخت برنامه ای شبیه به اینستاگرام را به صورت رایگان از سایت جاواپرو دانلود کنید.

نوع محتوامقاله آموزشی

موضوعآموزش برنامه نویسی »

زمان مطالعه۶ دقیقه

آخرین ویرایش۸ خرداد ۱۳۹۹

به نام خدا

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

قبل از شروع این جلسه یک نکته رو بررسی کنیم

ما در جلسه قبل فراموش کردیم برای پروفایل کاربر هم یک فیلد در دیتابیس تعریف کنیم پس سرور مجازی رو راه اندازی میکنیم و به ادرس localhost/phpmyadmin میریم به دیتابیسمون میریم و پس اون به جدول post میریم

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

به سربرگ structure میریم و مطابق تصویر یک میگیم یک ستون پس از caption اضافه کن و go رو میزنیم

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

مطابق تصویر 2 اسمش رو میذاریم profile از نوع text باشه و مقدار پیش فرض یا همون default هم میذاریم null باشه و بعد از اون روی save کلیک میکنیم تا اضافه بشه.

برمیگردیم به بحث اصلیمون بنده کلیات کار رو عرض کنم همین ابتدا تا بعد پیاده سازی دقیق برسیم. کلیات به این شکل هست که ما باید در سمت کلاینت یک درخواست بدیم و هرچی که توی دیتابیس و جدول post هست رو دریافت کنیم و توی برنامه نشونش بدیم به همین سادگی!پروژه مون رو باز میکنیم کتابخونه پیکاسو لازم داریم برای دانلود عکس ها اونو به این شکل در build.gradle(module:app) اضافه میکنیم و بعد از اطمینان از روشن بودن تحریم شکن پروژه رو سینک میکنیم که به پروژه اضافه بشه:

implementation 'com.squareup.picasso:picasso:+'

کتابخانه 1

حالا یه کلاس جدید میسازیم به اسم PostProperty و به ازای هر ستون توی دیتابیس یک متغیر توی کلاسمون تعریف میکنیم و سازنده و getter , setter برای هرکدومشون تعریف میکنیم به این شکل:

public class PostProperty { String id,username,location,image,caption,profile; public PostProperty(String id, String username, String location, String image, String caption,String profile) { this.id = id; this.username = username; this.location = location; this.image = image; this.caption = caption; this.profile=profile; } public String getId() { return id; } public void setId(String id) { this.id = id; } public String getUsername() { return username; } public void setUsername(String username) { this.username = username; } public String getLocation() { return location; } public void setLocation(String location) { this.location = location; } public String getImage() { return image; } public void setImage(String image) { this.image = image; } public String getCaption() { return caption; } public void setCaption(String caption) { this.caption = caption; } public String getProfile() { return profile; } public void setProfile(String profile) { this.profile = profile; } }

نمونه کد 1

شاید بپرسید دلیل تعریف این کلاس چی بود؟ اطلاعاتی که از سمت سرور میاد در قالب آرایه ای از json میاد و با استفاده از این کلاس و لیستی که از این کلاس میسازیم اطلاعات رو از json میگیریم و توی این لیست ذخیره میکنیم و لیست رو هم میدیم به recyclerview که بهمون نشون داده بشه. ابتدا میریم و سمت سرور رو برنامه نویسی میکنیم یک فایل php جدید توی فولدر Instagram موجود در فولدر htdocs سرور مجازیمون میسازیم به اسم loadpost.php و با notepad++ سمت سرور رو برنامه نویسی میکنیم. تگ php رو باز میکنیم و اتصال به دیتابیس رو برقرار میکنیم مطابق جلسات قبل به این شکل:

نمونه کد 2

حالا که اتصالمون به دیتابیس برقرار شد باید کوئری بنویسیم و هرچی که توی دیتابیسمون هست رو بگیریم به این شکل:

$stmt=$cnn->prepare("select id, username, location, image, caption, profile from post"); $stmt->execute(); $stmt ->bind_result($id, $username, $location ,$image, $caption, $profile);

نمونه کد 3

بعد از اون باید یک آرایه بسازیم و هرچی که از دیتابیس در میاد رو بریزیم توی این آرایه به این شکل:

$post=array(); while($stmt->fetch()){ $temp=array(); $temp['id']=$id; $temp['username']=$username; $temp['location']=$location; $temp['image']=$image; $temp['caption']=$caption; $temp['profile']=$profile; array_push($post,$temp); }

نمونه کد 4

با نمونه کد 4 ما یک ارایه میسازیم و هرچی که از دیتابیس میاد رو با استفاده از ارایه کمکی درونش میریزیم حالا وقتشه که این ارایه $post رو به فرمت json بفرستیم به سمت کلاینتمون(کاربرمون) به این شکل:

echo json_encode($post); mysqli_close($cnn);

نمونه کد 5

آموزش رایگان صفر تا پیشرفته برنامه نویسی اندروید جاواپرو

کد کلی اتصال به سرور:

while($stmt->fetch()){ $temp=array(); $temp['id']=$id; $temp['username']=$username; $temp['location']=$location; $temp['image']=$image; $temp['caption']=$caption; $temp['profile']=$profile; array_push($post,$temp); } echo json_encode($post); mysqli_close($cnn);?>

نمونه کد 7

حالا میریم سمت اندروید و درخواست میدیم به این فایل php به HomeFragment میریم و باید اینجا یک متد تعریف کنیم برای درخواست به سرور و همچنین چندین متغیر برای نشون دادن پست ها به کاربرمون.

ابتدا متغیر ها رو تعریف میکنیم به این شکل:

RecyclerView recyclerView; LinearLayoutManager layoutManager; PostAdapter adapter; ArrayList allposts; RequestQueue queue;

نمونه کد 2

پس از اون توی onCreateView مقدار دهیشون میکنیم به این شکل:

View view = inflater.inflate(R.layout.fragment_home, container, false); recyclerView = view.findViewById(R.id.recyclerview); layoutManager = new LinearLayoutManager(getContext(), LinearLayoutManager.VERTICAL, false); allposts = new ArrayList(); adapter = new PostAdapter(getContext(), allposts); recyclerView.setLayoutManager(layoutManager); recyclerView.setAdapter(adapter); queue = Volley.newRequestQueue(getContext());loadPosts();return view;

نمونه کد 9

نمونه کد 10 رو ملاحظه بفرمایید یک متد داریم به نام loadPosts() که درخواست به سرور رو انجام میده پس باید این متد رو تعریف کنیم بنده تمام کد متد و همچنین درخواست رو میذارم و بعد توضیح میدم خدمتتون:

private void loadPosts() { StringRequest request = new StringRequest(Request.Method.GET, Server.server_address + "loadpost.php", new Response.Listener() { @Override public void onResponse(String response) { try { JSONArray posts = new JSONArray(response); for (int i = 0; i < posts.length(); i++) { JSONObject obj = posts.getJSONObject(i); String image = obj.getString("image"); String id = obj.getString("id"); String caption = obj.getString("caption"); String location = obj.getString("location"); String username = obj.getString("username"); String profile = obj.getString("profile"); PostProperty post = new PostProperty(id, username, location, image, caption,profile); allposts.add(post); adapter.notifyDataSetChanged(); } } catch (JSONException e) { Toast.makeText(getContext(), e.toString(), Toast.LENGTH_SHORT).show(); } } }, new Response.ErrorListener() { @Override public void onErrorResponse(VolleyError error) { Toast.makeText(getContext(), error.toString(), Toast.LENGTH_SHORT); } }); queue.add(request); }

نمونه کد 10

ما باز هم به استفاده از volley درخواست میدیم دلیل اینکه از androidnetworking که ابتدای دوره عرض کردم استفاده نمیکنم اینه که volley بسیار شناخته شده تر است و در پروژه های گروهی شما androidnetworking کمتر به کار می اید. یک درخواست به سرور به وسیله فایل loadpost.php میدیم و پاسخمون رو به صورت json میگیریم و درون یک لیست از نوع PostProperty ذخیره میکنیم و این لیست رو هم که در onCreateView به ریسایکلرویو برای نمایش میدیم. حالا باید این متد رو در onResume هم صدا بزنیم که که کاربر بین صفحات جابجا شد و دوباره به همین صفحه برگشت هم پست ها نمایش داده بشن. کلید های ترکیبی ctrl+o رو فشار میدیم و تایپ میکنیم onResume و متد رو override میکنیم و این متد loadpost رو درونش فراخوانی میکنیم به این شکل:

@Override public void onResume() { loadPosts(); super.onResume(); }

نمونه کد 11

کد کلی و نهایی HomeFragment به این شکل می باشد:

public class HomeFragment extends Fragment { RecyclerView recyclerView; LinearLayoutManager layoutManager; PostAdapter adapter; ArrayList allposts; RequestQueue queue; public HomeFragment() { } public static HomeFragment newInstance() { HomeFragment fragment = new HomeFragment(); return fragment; } @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); } @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { View view = inflater.inflate(R.layout.fragment_home, container, false); recyclerView = view.findViewById(R.id.recyclerview); layoutManager = new LinearLayoutManager(getContext(), LinearLayoutManager.VERTICAL, false); allposts = new ArrayList(); adapter = new PostAdapter(getContext(), allposts); recyclerView.setLayoutManager(layoutManager); recyclerView.setAdapter(adapter); queue = Volley.newRequestQueue(getContext()); loadPosts(); return view; } @Override public void onResume() { loadPosts(); super.onResume(); } private void loadPosts() { StringRequest request = new StringRequest(Request.Method.GET, Server.server_address + "loadpost.php", new Response.Listener() { @Override public void onResponse(String response) { try { JSONArray posts = new JSONArray(response); for (int i = 0; i < posts.length(); i++) { JSONObject obj = posts.getJSONObject(i); String image = obj.getString("image"); String id = obj.getString("id"); String caption = obj.getString("caption"); String location = obj.getString("location"); String username = obj.getString("username"); String profile = obj.getString("profile"); PostProperty post = new PostProperty(id, username, location, image, caption,profile); allposts.add(post); adapter.notifyDataSetChanged(); } } catch (JSONException e) { Toast.makeText(getContext(), e.toString(), Toast.LENGTH_SHORT).show(); } } }, new Response.ErrorListener() { @Override public void onErrorResponse(VolleyError error) { Toast.makeText(getContext(), error.toString(), Toast.LENGTH_SHORT); } }); queue.add(request); } }

نمونه کد 12

حالا به کلاس PostAdapter میریم تا اطاعات رو به ریسایکلر ویو ست کنیم. ابتدا یک لیست از نوع PostProperty میسازیم و در سازنده این لیست رو مقدار دهی میکنیم به این شکل:

Context context; LayoutInflater inflater; List allPosts; public PostAdapter(Context context, List allPosts) { this.context = context; inflater = inflater.from(context); this.allPosts = allPosts;}

نمونه کد 13

Context و LayoutInflater در جلسات قبل تعریف شده است و شما فقط List allPosts; رو تعریف کنید و به سازنده بدین و درون سازنده هم مقدار دهی کنید. حالا به onBindViewHolder میریم و به این شکل مقدار دهی میکنیم:

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

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

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