اهلا بكم

1. مقدمة إلى JTree:

JTree هو أحد مكونات #Swing التي يمكننا من خلالها عرض البيانات التسلسلية. يحتوي #JTree على "عقدة الجذر" والتي تعتبر أهم أصل لكل العقد في الشجرة. العقدة هي عنصر في شجرة. يمكن أن تحتوي العقدة على العديد من العقد الفرعية. يمكن أن يكون لدى العقدة الفرعية عقدة إضافية اخرى كما فى الشكل التالى :



2. إنشاء JTree بسيط:

دعونا الآن محاولة لبناء #JTree بسيط . دعنا نقول أننا نريد عرض قائمة الخضروات vegetables والفواكه fruits بالتسلسل الهرمي.

يتم تمثيل العقدة في Swing API كـ #TreeNode وهي واجهة. واجهة #MutableTreeNode يمتد هذه الواجهة التي تمثل عقدة قابلة للتغيير. يوفر Swing API تطبيق هذه الواجهة في الفئة  #DefaultMutableTreeNode .

سنستخدم فئة #DefaultMutableTreeNode لتمثيل العقدة الخاصة بنا. يتم توفير هذه الفئة في واجهة برمجة تطبيقات Swing ، ويمكننا استخدامها لتمثيل عقدنا. تحتوي هذه الفئة على طريقة add () التى تأخذ مثيل MutableTreeNode .

لذلك ، سنقوم أولاً بإنشاء عقدة الجذر. وبعد ذلك يمكننا إضافة العقد بشكل متكرر إلى هذا الجذر. لنبدأ بجذر بسيط بعقدتين فقط:

الكود:

import javax.swing.JFrame;
import javax.swing.JTree;
import javax.swing.SwingUtilities;
import javax.swing.tree.DefaultMutableTreeNode;
public class TreeExample extends JFrame
{
    private JTree tree;
    public TreeExample()
    {
        //إنشاء عقدة الجذر
        DefaultMutableTreeNode root = new DefaultMutableTreeNode("Root");

        //إنشاء عقدة فرعية
        DefaultMutableTreeNode vegetableNode = new DefaultMutableTreeNode("Vegetables");
        DefaultMutableTreeNode fruitNode = new DefaultMutableTreeNode("Fruits");

        //إضافة العقدة الفرعية الى العقدة الجذر
        root.add(vegetableNode);
        root.add(fruitNode);
        
        //إنشاء العنصر jtree مع تمرير عقدة الجذر اليها
        tree = new JTree(root);
        add(tree);
        
        this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        this.setTitle("JTree Example");      
        this.pack();
        this.setVisible(true);
    }
    
    public static void main(String[] args)
    {
        SwingUtilities.invokeLater(new Runnable() {
            @Override
            public void run() {
                new TreeExample();
            }
        });
    }      
}

المخرجات :


3. إضافة المزيد من العقد الفرعية إلى JTree

دعونا الآن نرى كيفية إضافة المزيد من العقد الفرعية إلى عقدة الخضار والفواكه التى تعتبر فرعية بحد ذاها. هذا بسيط جدا نحتاج فقط إلى إضافة مثيلات #DefaultMutableTreeNode إلى vegetableNode ومثيل fruitNode ، على النحو التالى :

الكود:

DefaultMutableTreeNode vegetableNode = new DefaultMutableTreeNode("Vegetables");
vegetableNode.add(new DefaultMutableTreeNode("Capsicum"));
vegetableNode.add(new DefaultMutableTreeNode("Carrot"));
vegetableNode.add(new DefaultMutableTreeNode("Tomato"));
vegetableNode.add(new DefaultMutableTreeNode("Potato"));
DefaultMutableTreeNode fruitNode = new DefaultMutableTreeNode("Fruits");
fruitNode.add(new DefaultMutableTreeNode("Banana"));
fruitNode.add(new DefaultMutableTreeNode("Mango"));
fruitNode.add(new DefaultMutableTreeNode("Apple"));
fruitNode.add(new DefaultMutableTreeNode("Grapes"));
fruitNode.add(new DefaultMutableTreeNode("Orange"));

عندما ندير البرنامج ، نحصل على المخرجات التالية:




يمكننا أن نرى أن الأيقونة المعروضة لعقدة "الخضروات" و "الفواكه" قد تغيرت من أيقونة ورقة إلى أيقونة مجلد. هذا يشير إلى أن هذه العقد لديها عقد فرعية أخري. لاحظ أيضًا أيقونة المعالج (الرمز الذي يشبه المفتاح) الذي يتم عرضه بجانب هذه العقد. يمكن النقر فوقها لتوسيع العقد.

لنقم الآن بتشغيل البرنامج مرة أخرى والنقر على هاتين المقابلتين لتوسيعهما. نحصل على الإخراج التالي:




بمجرد توسيع العقد ، يمكننا أن نرى كل العناصر الموجودة في الشجرة معروضة في بنية هرمية لطيفة. لاحظ أيضًا أنه يتم عرض المعالج برمز مؤشر مختلف.

4. تخصيص عرض JTree:


دعونا الآن نحاول تخصيص عرض JTree. دعونا الآن تشغيل البرنامج مرة أخرى والنقر على المقابض. ثم ، تغيير حجم الإطار لاستخدام أقل ارتفاع. سنحصل على الإخراج التالي:




شجرة بدون أشرطة التمرير

كما نرى ، عند تغيير حجم الإطار ، تكون العناصر مخفية. بدلا من ذلك ، كنا ترغب في عرض شريط التمرير والسماح للمستخدم بالتمرير لأعلى ولأسفل لرؤية بيانات الشجرة بأكملها.


5. إضافة شريط التمرير ل JTree


القيام بذلك بسيط للغاية. مثل العديد من مكونات Swing الأخرى ، نحتاج فقط إلى التفاف JTree داخل JScrollPane وإضافتها إلى الإطار. بدلاً من إضافة الشجرة إلى الإطار ، نضيف لوحة التمرير ، مثل:l]

الكود:

add(new JScrollPane(tree));

لنقم الآن بتشغيل البرنامج مرة أخرى ، وانقر على أيقونات المعالج لتوسيع العقد وتغيير حجم الإطار. سنحصل على ناتج مثل هذا:]
[rtl]
شجرة مع أشرطة التمرير

يمكننا أن نرى أنه يتم الآن إضافة شريط التمرير ، ويمكننا التمرير لرؤية العقد. الآن ، حاول وطي أحد العقد. يمكننا أن نرى أن شريط التمرير يختفي. يظهر شريط التمرير عندما يحتوي على عناصر خارج منطقة العرض.[/rtl]



[6. إخفاء عقدة الجذر من JTree]


العقدة الجذر هي الأعلى في التسلسل الهرمي. ومع ذلك ، قد لا تكون هناك حاجة إلى عرض عقدة الجذر في بعض الحالات. على سبيل المثال ، كنا نستخدم عقدة الجذر المعروضة مع النص "الجذر". هذا ليس مفيدًا جدًا. لذا ، ماذا لو أردنا إخفاءه؟ هذا ممكن مع اتصال API بسيط:


[/rtl]

الكود:

tree.setRootVisible(false);

دعونا الآن تشغيل البرنامج. نحصل على ما يلي عندما يتم توسيع الأشجار:




 

7. تغيير الأيقونات  لـ JTree

يستخدم JTree أيقونات مختلفة لتمثيل عقدة الجذر و العقد الفرعية كما رأينا أعلاه. ماذا لو كنا بحاجة إلى توفير الرموز الخاصة بنا لهذا الغرض؟ هذا ممكن جدا. نحن بحاجة إلى الاستفادة من العارض للقيام بذلك.

[size=16]باستخدام DefaultTreeCellRenderer:[/size]

سنقوم بإنشاء مثيل لفئة DefaultTreeCellRenderer ونستخدم طريقة setLeafIcon () لتعيين الرمز لجميع العقد الورقية لدينا. تأخذ هذه الطريقة مثيل لفئة ImageIcon . يتم استخدام فئة ImageIcon للتعامل مع عرض الصور. لذلك ، سنقوم أولاً بإنشاء مثيل ImageIcon ثم استخدامه مع العارض:

[/rtl]

الكود:

[rtl][size=15]
[/size][/rtl]
[rtl][size=15]ImageIcon imageIcon = new ImageIcon(TreeExample.class.getResource("/leaf.jpg"));
DefaultTreeCellRenderer renderer = new DefaultTreeCellRenderer();
renderer.setLeafIcon(imageIcon);[/size][/rtl]