استخدام معرض الصور في تطبيقك || برمجة الاندرويد

Yaser Alosh 2015-10-30 برمجة اندرويد 3 تعليقات

السلام عليكم
اليوم سأقوم بشرح عن كيفية فتح معرض الصور الموجود بالجهاز من تطبيقك واختيار صورة منه وبعدها استخدامها في تطبيقك
طبعا فتح معرض الصور مفيد جدا … فمثلا.. لو كان يجب على مستخدم تطبيقك انشاء حساب لاستخدام التطبيق … فسيكون من الأفضل وجود صورة لكل مستخدم … لذلك سيفتح المستخدم معرض الصور ويقم باختيار صورة يريدها .. وستصبح هي صورته الشخصية
… طبعا هذا مجرد مثال وهناك العديد من الحالات الأخرى التي ستحتاج فيها فتح معرض الصور … وقد حاولت تبسيط الكود قدر الإمكان ليفهمه الجدد في هذا المجال..أتمنى أن يكون واضحا وسهلا
في البداية قم بإنشاء مشروع جديد… وسمه ما تريد … لكن سأقوم أنا بتسميته “upload from gallery”
ثم افتح ملف اللاياوت الذي تم انشاءه تلقائيا عند انشاء المشروع وقم بإضافة صورة وزر
وفي خاصية الآي دي للزر … أعطه أي اسم تريده .. لكن يجب أن يكون واضحا .. في هذا المثال سأسميه : “ uploadButton”
ونفس الشيء بالنسبة للصورة … سأعطيها هذا الآي دي : ” photo”
ملاحظة : نوع الصورة هو : ImageView
والآن افتح ملف الاكتيفيتي التي تم انشائها تلقائياً ثم فوق دالة الاون كريت قم بانشاء الزر والصورة :
Button upload ;
ImageView photo;
بداخل دالة الاون كريت قم بتعريفهما عن طريق إعطائهما الآي دي الخاص بهما :

;(Button upload =(Button)findViewById(R.id.uploadButton

;(ImageView photo = (ImageView ) findViewById(R.id.photo
}() upload.setOnClickListener(new View.OnClickListener
@Override

}(public void onClick(View v

{

{

;(Button upload =(Button)findViewById(R.id.uploadButton

;(ImageView photo = (ImageView ) findViewById(R.id.photo

}() upload.setOnClickListener(new View.OnClickListener

@Override

}(public void onClick(View v

{

وسوف نقوم بوضع كود فتح معرض الصور بداخل كود الاون كليك للزر

لفتح معرض الصور تحتاج لاستخدام الانتنت … والانتنت هو كلاس يستخدم للتنقل بين اكتيفيتي واكتيفيتي أخرى داخل التطبيق .. أو لفتح اكتيفيتي خارج تطبيقك
ولفتح معرض الصور نستخدم الكود التالي :

;(Intent i = new Intent(Intent.ACTION_PICK,android.provider.MediaStore.Images.Media.EXTERNAL_CONTENT_URI

1	;(Intent i = new Intent(Intent.ACTION_PICK,android.provider.MediaStore.Images.Media.EXTERNAL_CONTENT_URI

وبعد تعريف الانتنت .. نحتاج لاستدعاء دالة startActivityForResult();
وهي تقوم بفتح الاكتفيتي الذي تم وضعه بالانتنت ولكن تنتظر بيانات معينة من هذه الاكتيفيتي وبحالتنا هذه سنستخدمها للحصول على الصورة من معرض الصور … :

startActivityForResult(Intent.createChooser(i, "Select Your Photo"), 1);

1	startActivityForResult(Intent.createChooser(i, "Select Your Photo"), 1);

في الباراميتر الأول نستدعي دالة createChooser();
وهي تحتوي على بارامترين
الأول : وهو الانتنت الذي تريد استخدامه وبجانبه العبارة التي تريدها أن تظهر عند فتح معرض الصور
الثاني : وهو الريكويست كود …سأضع رقم 1 كمثال .. و سأقوم بشرحه لاحقا …
ولاستخدام هذه الدالة و الحصول على البيانات منها ( الصورة التي اختارها المستخدم من المعرض )
سنحتاج لتطبيقها في الاكتفيتي التي سنستخدمها فيها
ضع هذه الدالة في الاكتيفيتي :

@Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
super.onActivityResult(requestCode, resultCode, data);
// if(resultCode == RESULT_OK) تعني ان كان قد تم الحصول على البيانات بدون مشاكل
if (resultCode == RESULT_OK){
if (requestCode == 1 ){
}
}
}

@Override

protected void onActivityResult(int requestCode, int resultCode, Intent data) {

super.onActivityResult(requestCode, resultCode, data);

// if(resultCode == RESULT_OK) تعني ان كان قد تم الحصول على البيانات بدون مشاكل

if (resultCode == RESULT_OK){

if (requestCode == 1 ){

}

نلاحظ وجود ثلاث باراميترات بهذه الدالة … الأول وهو الريكويست كود والذي وضعناه “1” عندما استدعينا هذه الدالة
والثاني هو الريسالت كود وهو يكون اما RESULT_CANCELED أو RESULT_OK
الأولى تعني انه تم الغاء الأمر لسبب معين والثانية انه قد تم الحصول على البيانات بنجاح

والباراميتر الثالث هو البيانات( الصورة ) التي اختارها المستخدم وسأقوم بشرح كيفية تحويلها إلى صورة لاستخدامها في تطبيقك
بالنسبة للريكوست كود فهو يستخدم لتحديد الانتنت الذي تريد استخدامه …

مثال : لو كان لديك ثلاث أزرار .. الأول سيقوم بفتح معرض الصور والثاني يقوم بفتح جهات الاتصال ..
لنفترض انك اعطيت الرقم واحد لانتنت فتح الصور … ورقم 2 لانتنت فتح جهات الاتصال .
onActivityResult ستقوم في دالة وعندها
بالتأكد من الرقم.. .فإذا كان 1 نستخدم كود لإحضار الصورة … وإذا كان 2 سنستخدم كود لإحضار اسم المتصل وهكذا… هذه فائدة الريكويست كود
والان سوف نضع الكود الذي سيحضر الصورة بعد التأكد من الرقم :

if (resultCode == RESULT_OK){
if (requestCode == 1 ){
Uri selectedImage = data.getData();

// selectedimage هو كائن من نوع uri
وهو يحتوي على عنوان الصورة التي اختارها المستخدم من معرض الصور

InputStream imageStream = getContentResolver().openInputStream(selectedImage);
// image stream هو اوبجيكت من نوع InputStream
وهو يستخدم لقراءة الملفات ... والان استخدمناه لقراءة عنوان الصورة

Bitmap SelectedPhoto = BitmapFactory.decodeStream(imageStream );// decodeStream هي دالة تستخدم لتحويل inputstream إلى بيتماب

photo.setImageBitmap(SelectedPhoto );// نقوم بتعيين البيتماب إلى الصورة
}
}

if (resultCode == RESULT_OK){

if (requestCode == 1 ){

Uri selectedImage = data.getData();

// selectedimage هو كائن من نوع uri

وهو يحتوي على عنوان الصورة التي اختارها المستخدم من معرض الصور

InputStream imageStream = getContentResolver().openInputStream(selectedImage);

// image stream هو اوبجيكت من نوع InputStream

وهو يستخدم لقراءة الملفات ... والان استخدمناه لقراءة عنوان الصورة

Bitmap SelectedPhoto = BitmapFactory.decodeStream(imageStream );// decodeStream هي دالة تستخدم لتحويل inputstream إلى بيتماب

photo.setImageBitmap(SelectedPhoto );// نقوم بتعيين البيتماب إلى الصورة

}

نلاحظ أننا قمنا بالتأكد من الريكويست كود … فإذا كان 1 نقوم بإحضار الصورة …
والآن أصبح الكود الكامل :

public class uploadFromGallary extends ActionBarActivity {
Button upload ;
ImageView photo;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_upload_from_gallary);
upload =(Button)findViewById(R.id.uploadButton);
photo = (ImageView ) findViewById(R.id.photo);
upload.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Intent i = new Intent( Intent.ACTION_PICK,android.provider.MediaStore.Images.Media.EXTERNAL_CONTENT_URI);
startActivityForResult(Intent.createChooser(i, "Select Your Photo"), 1);
}
});
}
@Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
super.onActivityResult(requestCode, resultCode, data);
// if(resultCode == RESULT_OK) تعني ان كان قد تم الحصول على البيانات بدون مشاكل
if (resultCode == RESULT_OK){
if (requestCode == 1 ){
Uri selectedImage = data.getData();
InputStream imageStream = getContentResolver().openInputStream(selectedImage);
Bitmap SelectedPhoto = BitmapFactory.decodeStream(imageStream );
photo.setImageBitmap(SelectedPhoto );
}
}
}

}

public class uploadFromGallary extends ActionBarActivity {

Button upload ;

ImageView photo;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_upload_from_gallary);

upload =(Button)findViewById(R.id.uploadButton);

photo = (ImageView ) findViewById(R.id.photo);

upload.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

Intent i = new Intent( Intent.ACTION_PICK,android.provider.MediaStore.Images.Media.EXTERNAL_CONTENT_URI);

startActivityForResult(Intent.createChooser(i, "Select Your Photo"), 1);

}

});

}

@Override

protected void onActivityResult(int requestCode, int resultCode, Intent data) {

super.onActivityResult(requestCode, resultCode, data);

// if(resultCode == RESULT_OK) تعني ان كان قد تم الحصول على البيانات بدون مشاكل

if (resultCode == RESULT_OK){

if (requestCode == 1 ){

Uri selectedImage = data.getData();

InputStream imageStream = getContentResolver().openInputStream(selectedImage);

Bitmap SelectedPhoto = BitmapFactory.decodeStream(imageStream );

photo.setImageBitmap(SelectedPhoto );

}

بالطبع بالبرمجة هناك أكثر من طريقة لعمل شيء معين .. لذلك هذه ليست الطريقة الوحيدة لأخذ صورة من معرض الصور في الجهاز وهذه ليست الطريقة الأفضل أيضا لكنها سهلة وواضحة تقريبا … هناك بعض الأخطاء التي ستحدث عند اختيار صورة كبيرة الحجم .. وسيتوقف التطبيق بسبب ذلك ..لكن سنتعلم طريقة لتغير حجم الصورة لتفادي هذا الخطأ في درس آخر ان شاءالله … وأيضا سنستخدم مكتبة ” بيكاسو” لتعيين الصورة بدلا من هذه الطريقة في درس آخر …. والسلام عليكم