تعلم JavaFx ..مقال35_التعامل مع الصور_ الكلاس ImageView & Image

اذهب الى الأسفل

تعلم JavaFx ..مقال35_التعامل مع الصور_ الكلاس ImageView & Image  Empty تعلم JavaFx ..مقال35_التعامل مع الصور_ الكلاس ImageView & Image

مُساهمة من طرف زهراء في الجمعة أكتوبر 26, 2018 8:50 am

أهلا بكم

هذا المقال سنتعلم سويا كيفية التعامل مع الصور فى تطبيقات JavaFX ، وكيفية عرض الصورة في نافذة تطبيقك وكيفية تغيير وحدات البكسل الخاصة بالصورة.

خطوات التعامل مع الصور فى تطبيقك :

الخطوة الاولى : إستخدام الفئة Image لتحميل الصورة الى تطبيقك 

يتوفر JavaFX في الحزمة javafx.scene.image الفئة Image لقراءة وتحميل الصور الى تطبيقك وتدعم الكثير من تنسيقات الصور مثل Bmp و Gif و Jpeg و Png.

وتستخدم في تحميل الصور أما من عنوان URL محدد.أو من تدفق الكائن InputStream وذلك على النحو التالى :

أولا : إنشاء صورة من عنوان URL محدد .

الكود:
public Image(String url,
             double requestedWidth,
             double requestedHeight,
             boolean preserveRatio,
             boolean smooth,
             boolean backgroundLoading)

حيث أن :


  1. url :  السلسلة التي تمثل عنوان URL المراد استخدامه في جلب بيانات البكسل 
  2. requestWidth - عرض مربع الصورة المحيط
  3. requiredHeight - ارتفاع المربع المحيط للصورة
  4. preserveRatio - يشير إلى ما إذا كان سيتم الحفاظ على نسبة العرض إلى الارتفاع للصورة الأصلية عند تغيير الحجم لملاءمة الصورة داخل المربع المحيط المحدد
  5. smooth : تشير إلى ما إذا كنت ستحافظ على جودة الصورة اثناء تغير حجمها ام لا 
  6. backgroundLoading - يشير إلى ما إذا كان يتم تحميل الصورة في الخلفية



مثال : تحميل صورة من عنوان url مع تعديل حجمها الى 100*150 بيكسل بدون الحفاظ على نسبة عرضها للارتفاع الاصلي وعدم الحفاظ على جودتها الاصلية

الكود:
Image image3 = new Image("http://sample.com/res/flower.png", 100, 150, false, false);


مثال : تحميل صورة من مجلد التطبيق classpath ...إذا لم تكن السلسلة التي تم تمريرها عنوان URL صالحًا ، ولكن مسارًا بدلاً من ذلك ، فسيتم البحث عن الصورة في classpath في هذه الحالة على النحو التالى 
الكود:
Image image1 = new Image("/flower.png"
);


مثال : تحميل الصورة من حزمة معينة ....توجد الصورة في حزمة my.res من مسار classpath
الكود:
Image image2 = new Image("my/res/flower.png");

مثال :تحميل الصورة من مجلد العمل الحالى
الكود:
Image image4 = new Image("file:flower.png");



ثانيا : إنشاء صورة مع المحتوى الذي تم تحميله من تدفق الإدخال المحدد....ثم تمرير التدفق الى كائن Image
الكود:
Image(InputStream is)


مثال :تحميل صورة من مسار محدد باستخدام طريقة التدفق InputStream ثم تمرير التدفق الى كائن الصورة 

الكود:

FileInputStream inputstream = new FileInputStream("C:\\images\\image.jpg");
Image image = new Image(inputstream);




الخطوة الثانية : إستخدام الفئة ImageView لعرض الصورة على ناذة تطبيقك

بعد أن قمنا بتحميل الصورة من خلال الفئة Image باى طريقة كما اوضحنا اعلاه ، يمكنك عرض الصورة على ناقذة تطبيقك عن طريق إنشاء فئة ImageView وتمرير الصورة إلى منشئها كما يلي -


الكود:
ImageView imageView = new ImageView(image);


مثال كامل :

الكود:

import java.io.FileInputStream;
import java.io.FileNotFoundException;
import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;  
import javafx.stage.Stage;  

public class ImageExample extends Application {  
   @Override
   public void start(Stage stage) throws FileNotFoundException {        
      //Creating an image
      Image image = new Image(new FileInputStream("path of the image"));  
      
      //Setting the image view
      ImageView imageView = new ImageView(image);
      
      //Setting the position of the image
      imageView.setX(50);
      imageView.setY(25);
      
      //setting the fit height and width of the image view
      imageView.setFitHeight(455);
      imageView.setFitWidth(500);
      
      //Setting the preserve ratio of the image view
      imageView.setPreserveRatio(true);  
      
      //Creating a Group object  
      Group root = new Group(imageView);  
      
      //Creating a scene object
      Scene scene = new Scene(root, 600, 500);  
      
      //Setting title to the Stage
      stage.setTitle("Loading an image");  
      
      //Adding scene to the stage
      stage.setScene(scene);
      
      //Displaying the contents of the stage
      stage.show();
   }  
   public static void main(String args[]) {
      launch(args);
   }
}


النتيجة على النحو التالى :

تعلم JavaFx ..مقال35_التعامل مع الصور_ الكلاس ImageView & Image  Loading_image


عدل سابقا من قبل زهراء في الجمعة أكتوبر 26, 2018 9:22 am عدل 1 مرات
زهراء
زهراء
........
........

تاريخ التسجيل : 18/02/2011
المساهمات : 406
النقاط : 691
التقيم : 55
الدولة : مصر
الجنس : انثى

الرجوع الى أعلى الصفحة اذهب الى الأسفل

تعلم JavaFx ..مقال35_التعامل مع الصور_ الكلاس ImageView & Image  Empty رد: تعلم JavaFx ..مقال35_التعامل مع الصور_ الكلاس ImageView & Image

مُساهمة من طرف زهراء في الجمعة أكتوبر 26, 2018 8:57 am

قرءة وحدات البيكسل و التعديل على الصور 


يوفر JavaFX فئة تسمي PixelReader و اخرى تسمي PixelWriter لقراءة وحدات البكسل الخاصة بالصورة وكتابتها. يتم استخدام فئة WritableImage لإنشاء صورة قابلة للكتابة.

فيما يلي مثال يوضح كيفية قراءة وحدات البكسل للصورة وكتابتها. هنا ، نقرأ قيمة لون صورة ما ونجعلها أكثر قتامة.
الكود:

import java.io.FileInputStream;
import java.io.FileNotFoundException;  
import javafx.application.Application;

import javafx.scene.Group;  
import javafx.scene.Scene;

import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.image.PixelReader;
import javafx.scene.image.PixelWriter;
import javafx.scene.image.WritableImage;
 
import javafx.scene.paint.Color;
import javafx.stage.Stage;  

public class WritingPixelsExample extends Application {  
   @Override
   public void start(Stage stage) throws FileNotFoundException {        
      //Creating an image
      Image image = new Image(new FileInputStream("C:\\images\\logo.jpg"));
      int width = (int)image.getWidth();
      int height = (int)image.getHeight();
        
      //Creating a writable image
      WritableImage wImage = new WritableImage(width, height);
        
      //Reading color from the loaded image
      PixelReader pixelReader = image.getPixelReader();
      
      //getting the pixel writer
      PixelWriter writer = wImage.getPixelWriter();          
      
      //Reading the color of the image
      for(int y = 0; y < height; y++) {
         for(int x = 0; x < width; x++) {
            //Retrieving the color of the pixel of the loaded image  
            Color color = pixelReader.getColor(x, y);
              
            //Setting the color to the writable image
            writer.setColor(x, y, color.darker());              
         }
      }   
      //Setting the view for the writable image
      ImageView imageView = new ImageView(wImage);
              
      //Creating a Group object  
      Group root = new Group(imageView);  
            
      //Creating a scene object
      Scene scene = new Scene(root, 600, 500);  
            
      //Setting title to the Stage
      stage.setTitle("Writing pixels ");  
            
      //Adding scene to the stage
      stage.setScene(scene);  
            
      //Displaying the contents of the stage
      stage.show();  
   }
   public static void main(String args[]) {
      launch(args);
   }
}

النتيجة

تعلم JavaFx ..مقال35_التعامل مع الصور_ الكلاس ImageView & Image  Writing_pixels
زهراء
زهراء
........
........

تاريخ التسجيل : 18/02/2011
المساهمات : 406
النقاط : 691
التقيم : 55
الدولة : مصر
الجنس : انثى

الرجوع الى أعلى الصفحة اذهب الى الأسفل

الرجوع الى أعلى الصفحة

ََ

مواضيع ذات صلة


 
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى