تعلم JavaFx ..مقال34_ التعامل مع الالوان JavaFX - Colors

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

تعلم JavaFx ..مقال34_ التعامل مع الالوان JavaFX - Colors Empty تعلم JavaFx ..مقال34_ التعامل مع الالوان JavaFX - Colors

مُساهمة من طرف زهراء في الخميس أكتوبر 25, 2018 12:34 pm

أهلا بكم

يوفر JavaFX فئات متنوعة في حزمة javafx.scene.paint تحتوي هذه الحزمة على فئة مجردة تسمى Paint وهي الفئة الأساسية لجميع الفئات المستخدمة لتطبيق واستخدام الالوان على تطبيق ما ، 

باستخدام هذه الفئات ، يمكنك تطبيق الألوان في الأنماط التالية -


  1. النمط Uniform : في هذا النمط ، يتم تطبيق اللون بشكل موحد في جميع أنحاء الكائن . 
  2. النمط Image Pattern :نمط الصورة - يتيح لك ذلك ملء منطقة العقدة بصورة.
  3. النمط Gradient :في هذا النمط ، يختلف اللون المطبق على العقدة من نقطة إلى أخرى. له نوعان من التدرجات وهما التدرج الخطي والتدرج النصف قطري.


كافة الانماط تلك يمكنك استخدامها لتطبيق اللون على الكائنات مثل الاشكال و الرسوم ، النصوص وذلك باستخادم الاسلوب المسمى setFill () و setStroke لتعيين قيم اللون للكائن ولحدوده على التوالي.


تطبيق نمط Uniform اللون الموحد  

لتعيين نمط ألوان الموحد على الاشكال و النصوص، تحتاج إلى تمرير كائن اللون إلى الاسلوب setFill لتطبيق اللون على الشكل  و الاسلوب  setStroke لتطبيق اللون على حدوده على النحو التالي

الكود:
Color color = new Color.BEIGE
text.setFill(color);

//Setting color to the stroke
Color color = new Color.DARKSLATEBLUE
circle.setStroke(color);

في قالب التعليمة البرمجية أعلاه ، نستخدم المتغيرات الثابتة لفئة اللون لإنشاء كائن لون....بنفس الطريقة ، يمكنك أيضًا استخدام قيم RGB أو قيم HSB للتلوين أو رموز الالوان القياسية كما هو موضح أدناه

الكود:
//creating color object by passing RGB values
Color c = Color.rgb(0,0,255);  

//creating color object by passing HSB values
Color c = Color.hsb(270,1.0,1.0);  

//creating color object by passing the hash code for web
Color c = Color.web("0x0000FF",1.0);

مثال كامل للتوضيح :

الكود:
import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.paint.Color;
import javafx.stage.Stage;
import javafx.scene.shape.Circle;
import javafx.scene.text.Font;
import javafx.scene.text.Text;
        
public class ColorExample extends Application {
   @Override
   public void start(Stage stage) {
      //Drawing a Circle
      Circle circle = new Circle();    
      
      //Setting the properties of the circle
      circle.setCenterX(300.0f);
      circle.setCenterY(180.0f);
      circle.setRadius(90.0f);
      
      //Setting color to the circle
      circle.setFill(Color.DARKRED);    
      
      //Setting the stroke width
      circle.setStrokeWidth(3);
      
      //Setting color to the stroke  
      circle.setStroke(Color.DARKSLATEBLUE);
      
      //Drawing a text
      Text text = new Text("This is a colored circle");
      
      //Setting the font of the text
      text.setFont(Font.font("Edwardian Script ITC", 50));
      
      //Setting the position of the text
      text.setX(155);
      text.setY(50);
      
      //Setting color to the text
      text.setFill(Color.BEIGE);
      text.setStrokeWidth(2);
      text.setStroke(Color.DARKSLATEBLUE);
        
      //Creating a Group object  
      Group root = new Group(circle, text);
        
      //Creating a scene object
      Scene scene = new Scene(root, 600, 300);  
      
      //Setting title to the Stage
      stage.setTitle("Color Example");
        
      //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 ..مقال34_ التعامل مع الالوان JavaFX - Colors Color_example
زهراء
زهراء
........
........

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

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

تعلم JavaFx ..مقال34_ التعامل مع الالوان JavaFX - Colors Empty رد: تعلم JavaFx ..مقال34_ التعامل مع الالوان JavaFX - Colors

مُساهمة من طرف زهراء في الخميس أكتوبر 25, 2018 12:54 pm

تطبيق نمط Image Pattern على الكائن

لتطبيق نمط صورة على العقد ، قم بإنشاء فئة ImagePattern وتمرير كائنها إلى الاسلوبين setFill ، و setStroke

منشئ هذه الفئة يقبل ستة معايير وهي -

الكود:
ImagePattern radialGradient = new ImagePattern(dots, 20, 20, 40, 40, false);

Image- كائن الصورة التي تريد إنشاء النمط بها.

x and y - قيم رقمية Double تمثل إحداثيات (x، y) من أصل مستطيل الربط.

height and width -  قيم رقمية Double تمثل ارتفاع وعرض الصورة المستخدمة لإنشاء نمط.

isProportional - هذا متغير منطقي؛ عند تعيين هذه الخاصية الي true ، يتم تعيين مواقع البدء والانتهاء لتكون متناسبة.

مثال توضحي :

الكود:
import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.image.Image;

import javafx.scene.paint.Color;
import javafx.scene.paint.ImagePattern;
import javafx.scene.paint.Stop;

import javafx.stage.Stage;
import javafx.scene.shape.Circle;
import javafx.scene.text.Font;
import javafx.scene.text.Text;
        
public class ImagePatternExample extends Application {
   @Override
   public void start(Stage stage) {          
      //Drawing a Circle
      Circle circle = new Circle();    
      
      //Setting the properties of the circle
      circle.setCenterX(300.0f);
      circle.setCenterY(180.0f);
      circle.setRadius(90.0f);
      
      //Drawing a text
      Text text = new Text("This is a colored circle");
      
      //Setting the font of the text
      text.setFont(Font.font("Edwardian Script ITC", 50));
      
      //Setting the position of the text
      text.setX(155);
      text.setY(50);
      
      //Setting the image pattern
      String link = "https://encrypted-tbn1.gstatic.com"
         + "/images?q=tbn:ANd9GcRQub4GvEezKMsiIf67U"
         + "rOxSzQuQ9zl5ysnjRn87VOC8tAdgmAJjcwZ2qM";      
      
      Image image = new Image(link);
      ImagePattern radialGradient = new ImagePattern(image, 20, 20, 40, 40, false);
      
      //Setting the linear gradient to the circle and text
      circle.setFill(radialGradient);
      text.setFill(radialGradient);
        
      //Creating a Group object  
      Group root = new Group(circle, text);
        
      //Creating a scene object
      Scene scene = new Scene(root, 600, 300);  
      
      //Setting title to the Stage
      stage.setTitle("Image pattern Example");
        
      //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 ..مقال34_ التعامل مع الالوان JavaFX - Colors Image_pattern_example
زهراء
زهراء
........
........

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

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

تعلم JavaFx ..مقال34_ التعامل مع الالوان JavaFX - Colors Empty رد: تعلم JavaFx ..مقال34_ التعامل مع الالوان JavaFX - Colors

مُساهمة من طرف زهراء في الخميس أكتوبر 25, 2018 1:17 pm

تطبيق نمط التدرج Gradient على الكائن

أوضحنا ان نمط التدرج للالوان نوعان هما :


  1. نمط التدرج الخطي LinearGradient
  2. نمط التدرج النصف قطرى RadialGradient 


لتطبيق نمط التدرج الخطي على العقد ، قم بإنشاء فئة LinearGradient وتمرير كائنها إلى الطرق setFill  ، setStroke 

منشئ هذه الفئة يقبل خمسة معايير وهي -

startX، startY - تمثل هذه الخصائص من النوع double إحداثيات x و y من نقطة البداية للتدرج.

endX، endY - تمثل هذه الخصائص من النوع double إحداثيات x و y لنقطة النهاية للتدرج.

cycleMethod - تحدد هذه الوسيطة كيف يجب ملء المناطق خارج حدود التدرج اللوني ، المحددة بنقاط البداية والنهاية.

proportional - هذا هو متغير منطقى عند تعيين هذه الخاصية على "true" ، يتم تعيين مواقع البدء والانتهاء إلى نسبة.

Stops- تحدد هذه الوسيطة نقاط توقف اللون على طول خط التدرج.

ويتم ذلك على النحو التالى :

الكود:

//Setting the linear gradient
Stop[] stops = new Stop[] {
   new Stop(0, Color.DARKSLATEBLUE),  
   new Stop(1, Color.DARKRED)
};  
LinearGradient linearGradient =
   new LinearGradient(0, 0, 1, 0, true, CycleMethod.NO_CYCLE, stops);


مثال توضيحيى :

الكود:
import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;

import javafx.scene.paint.Color;
import javafx.scene.paint.CycleMethod;
import javafx.scene.paint.LinearGradient;
import javafx.scene.paint.Stop;

import javafx.stage.Stage;
import javafx.scene.shape.Circle;
import javafx.scene.text.Font;
import javafx.scene.text.Text;
        
public class LinearGradientExample extends Application {
   @Override
   public void start(Stage stage) {          
      //Drawing a Circle
      Circle circle = new Circle();    
      
      //Setting the properties of the circle
      circle.setCenterX(300.0f);  
      circle.setCenterY(180.0f);
      circle.setRadius(90.0f);
      
      //Drawing a text
      Text text = new Text("This is a colored circle");
      
      //Setting the font of the text
      text.setFont(Font.font("Edwardian Script ITC", 55));
      
      //Setting the position of the text
      text.setX(140);
      text.setY(50);
      
      //Setting the linear gradient
      Stop[] stops = new Stop[] {
         new Stop(0, Color.DARKSLATEBLUE),  
         new Stop(1, Color.DARKRED)
      };  
      LinearGradient linearGradient =
         new LinearGradient(0, 0, 1, 0, true, CycleMethod.NO_CYCLE, stops);
      
      //Setting the linear gradient to the circle and text
      circle.setFill(linearGradient);
      text.setFill(linearGradient);
        
      //Creating a Group object  
      Group root = new Group(circle, text);
        
      //Creating a scene object
      Scene scene = new Scene(root, 600, 300);  
      
      //Setting title to the Stage
      stage.setTitle("Linear Gradient Example");
        
      //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 ..مقال34_ التعامل مع الالوان JavaFX - Colors Linear_gradient

أما لتطبيق نمط التدرج القطري على العقد ، قم بتأسيس فئة GradientPattern وتمرير كائنها إلى الطرق setFill () ، setStroke () كما فعلنا أعلاه 

مثال توضحيحى :

الكود:

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;

import javafx.scene.paint.Color;
import javafx.scene.paint.CycleMethod;
import javafx.scene.paint.RadialGradient;  
import javafx.scene.paint.Stop;

import javafx.stage.Stage;
import javafx.scene.shape.Circle;
import javafx.scene.text.Font;
import javafx.scene.text.Text;  

public class RadialGradientExample extends Application {  
   @Override
   public void start(Stage stage) {
      //Drawing a Circle
      Circle circle = new Circle();
      
      //Setting the properties of the circle
      circle.setCenterX(300.0f);
      circle.setCenterY(180.0f);
      circle.setRadius(90.0f);  
      
      //Drawing a text
      Text text = new Text("This is a colored circle");
      
      //Setting the font of the text
      text.setFont(Font.font("Edwardian Script ITC", 50));
      
      //Setting the position of the text
      text.setX(155);
      text.setY(50);  
      
      //Setting the radial gradient
      Stop[] stops = new Stop[] {
         new Stop(0.0, Color.WHITE),  
         new Stop(0.3, Color.RED),
         new Stop(1.0, Color.DARKRED)
      };        
      RadialGradient radialGradient =
         new RadialGradient(0, 0, 300, 178, 60, false, CycleMethod.NO_CYCLE, stops);  
      
      //Setting the radial gradient to the circle and text
      circle.setFill(radialGradient);
      text.setFill(radialGradient);  
      
      //Creating a Group object  
      Group root = new Group(circle, text);  
      
      //Creating a scene object
      Scene scene = new Scene(root, 600, 300);
      
      //Setting title to the Stage
      stage.setTitle("Radial Gradient Example");  
      
      //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 ..مقال34_ التعامل مع الالوان JavaFX - Colors Radial_gradient
زهراء
زهراء
........
........

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

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

تعلم JavaFx ..مقال34_ التعامل مع الالوان JavaFX - Colors Empty رد: تعلم JavaFx ..مقال34_ التعامل مع الالوان JavaFX - Colors

مُساهمة من طرف NEXT في الخميس أكتوبر 25, 2018 4:37 pm

نحياتى و  تشكراتى الاستاذة الكريم 

ـــــــــــــــــــ التوقيع ــــــــــــــــــــ
تعلم JavaFx ..مقال34_ التعامل مع الالوان JavaFX - Colors Do.php?imgf=154090993464951
NEXT
NEXT
الادارة
الادارة

تاريخ التسجيل : 18/02/2011
المساهمات : 386
النقاط : 200566
التقيم : 14
الدولة : مصر
الجنس : ذكر

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

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

ََ

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


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