Home  Contents

1.ادوات متقدمة فى Mono WinForms

سنناقش بعض الأدوات المتقدمة ك ListBox, the ListView and the TreeView control.

1.ListBox Control

اداة ال ListBox تستخدم لعرض قائمة من العناصر يختار منها المستخدم واحدا او اكثر بالضغط عليهم

listbox.cs

using System;
using System.Drawing;
using System.Windows.Forms;

class MForm : Form {

    private StatusBar sb;

    public MForm() {
        Text = "ListBox";
        Size = new Size(210, 210);

        ListBox lb = new ListBox();
        lb.Parent = this;
        lb.Items.Add("Jessica");
        lb.Items.Add("Rachel");
        lb.Items.Add("Angelina");
        lb.Items.Add("Amy");
        lb.Items.Add("Jennifer");
        lb.Items.Add("Scarlett");

        lb.Dock = DockStyle.Fill;
        lb.SelectedIndexChanged += new EventHandler(OnChanged);

        sb = new StatusBar();
        sb.Parent = this;

        CenterToScreen();
    }


    void OnChanged(object sender, EventArgs e) {
        ListBox lb = (ListBox) sender;
        sb.Text = lb.SelectedItem.ToString();
    }
}

class MApplication {
    public static void Main() {
        Application.Run(new MForm());
    }
}

فى المثال نعرض قائمة من 6 عناصر والمختار يتم تحديده على شريط الحالة

 ListBox lb = new ListBox();
 lb.Parent = this;

انشاء الأداة وتحديد الأب

 lb.Items.Add("Jessica");

هنا نضيف عنصرا جديدا، تشمل الأداة خاصية Items ، التى تشير لعناصر القائمة. عن طريقها نستطيع اضافة، حذف، او الحصول على عدد العناصر

 lb.SelectedIndexChanged += new EventHandler(OnChanged);

عند تغيير العنصر المختار يتم اطلاق الحدث SelectedIndexChanged



 ListBox lb = (ListBox) sender;
 sb.Text = lb.SelectedItem.ToString();

فى الطريقة OnChange نحصل على مشير لاداة الlistbox ونحدد العنصر المختار فى شريط الحالة




ListBox

Figure: ListBox

2.ListView

ال ListView هو اداة لعرض مجموعة من العناصر بطريقة اكثر تعقيدا من ال ListBox (فى الغالب فى واجهات تشمل اكثر من عمود)



listview.cs

using System;
using System.Drawing;
using System.Windows.Forms;
using System.Collections.Generic;


public class Actress
{
    public string name;
    public int year;
 
    public Actress(string name, int year)
    {
        this.name = name;
        this.year = year;
    }
}


class MForm : Form {

    private StatusBar sb;

    public MForm() {
        Text = "ListView";
        Size = new Size(350, 300);


        List<Actress> actresses = new List<Actress>();

        actresses.Add(new Actress("Jessica Alba", 1981));
        actresses.Add(new Actress("Angelina Jolie", 1975));
        actresses.Add(new Actress("Natalie Portman", 1981));
        actresses.Add(new Actress("Rachel Weiss", 1971));
        actresses.Add(new Actress("Scarlett Johansson", 1984));


        ColumnHeader name = new ColumnHeader();
        name.Text = "Name";
        name.Width = -1;
        ColumnHeader year = new ColumnHeader();
        year.Text = "Year";

        SuspendLayout();

        ListView lv = new ListView();
        lv.Parent = this;
        lv.FullRowSelect = true;
        lv.GridLines = true;
        lv.AllowColumnReorder = true;
        lv.Sorting = SortOrder.Ascending;
        lv.Columns.AddRange(new ColumnHeader[] {name, year});
        lv.ColumnClick += new ColumnClickEventHandler(ColumnClick);

        foreach (Actress act in actresses) {
            ListViewItem item = new ListViewItem();
            item.Text = act.name;
            item.SubItems.Add(act.year.ToString());
            lv.Items.Add(item);
        }

        lv.Dock = DockStyle.Fill;
        lv.Click += new EventHandler(OnChanged);

        sb = new StatusBar();
        sb.Parent = this;
        lv.View = View.Details;

        ResumeLayout();

        CenterToScreen();
    }

    void OnChanged(object sender, EventArgs e) {
        ListView lv = (ListView) sender;
        string name = lv.SelectedItems[0].SubItems[0].Text;
        string born = lv.SelectedItems[0].SubItems[1].Text;
        sb.Text = name + ", " + born;
    }

    void ColumnClick(object sender, ColumnClickEventArgs e)
    {
        ListView lv = (ListView) sender;

        if (lv.Sorting == SortOrder.Ascending) {
            lv.Sorting = SortOrder.Descending;
        } else {
            lv.Sorting = SortOrder.Ascending;
        }   
    }
}


class MApplication {
    public static void Main() {
        Application.Run(new MForm());
    }
}

فى مثالنا لدينا listview تحوى عمودين ، نعرض فيهما اسم الممثلة وتاريخ ميلادها. نخزن البيانات فى List. وبإختيار صف معين يتم عرض محتوى الصف فى شريط الحالة، وايضا عند الضغط على الهيدر (العنوان) للعمود يتم ترتيب العناصر

In our example, we have a listview with two columns. In the first column, we display the name of the actress. In the second one their date of birth. The data is store in a List collection. By selecting a row, the data in a row is displayed in the statusbar. Also, by clicking on the column header, the data is sorted. 

 public class Actress
 {
 ...
 }

ننشئ صف الممثلة ليمثل بياناتها

We use the Actress class to store our data. 

 List<Actress> actresses = new List<Actress>();

 actresses.Add(new Actress("Jessica Alba", 1981));
 actresses.Add(new Actress("Angelina Jolie", 1975));
 ...

ننشئ مجموعتنا من الممثلات 

 ColumnHeader name = new ColumnHeader();
 name.Text = "Name";
 name.Width = -1;

لكل عمود فى اى listview ننشئ ColumnHeader (ليعبر عن عنوان العمود)، و بتحديد الخاصية Width الى -1 سيكون العرض بطول اطول العناصر



 ListView lv = new ListView();
 lv.Parent = this;

هنا انشئنا الآداة وحددنا الأب

 lv.FullRowSelect = true;
 lv.GridLines = true;
 lv.AllowColumnReorder = true; 
 lv.Sorting = SortOrder.Ascending;

هنا حددنا 4 خصائص للأداة

1- السماح بإختيار كامل للصف

2- عرض خطوط الشبكة

3- السماحية بإعادة ترتيب الأعمدة

4- نوع الترتيب تصاعدى (من الأصغر للأكبر)



 lv.Columns.AddRange(new ColumnHeader[] {name, year});

هنا نضيف عناوين الأعمدة للآداة 

 foreach (Actress act in actresses) {
     ListViewItem item = new ListViewItem();
     item.Text = act.name;
     item.SubItems.Add(act.year.ToString());
     lv.Items.Add(item);
 }

فى هذه الحلقة نقوم بتجهيز الآداة (محتويات الأعمدة -البيانات-). وكل صف يتم اضافته عن طريق كائن من الصف ListViewItem 

 lv.View = View.Details;

نوعية عرضة الواجهة الخاصة بالآداة. العديد من الطرق تعرض الداتا بطريقة مختلفة (ك Details, Icons وهكذا)

 ListView lv = (ListView) sender;
 string name = lv.SelectedItems[0].SubItems[0].Text;
 string born = lv.SelectedItems[0].SubItems[1].Text;
 sb.Text = name + ", " + born;

فى الطريقة OnChanged نحصل على البيانات من الصف المختار ونعرضه فى شريط الحالة



 if (lv.Sorting == SortOrder.Ascending) {
     lv.Sorting = SortOrder.Descending;
 } else {
     lv.Sorting = SortOrder.Ascending;
 }

هنا نقوم بعكس كيفية الترتيب (ان كان تصاعدى نجعله تنازلى والعكس بالعكس)




ListView

Figure: ListView

3.TreeView

تستخدم اداة TreeView فى عرض مجموعة من العناصر على صورة شجرة وكل عنصر فيها يتم تمثيله عن طريق TreeNode

TreeView control displays hierarchical collection of items. Each item in this control is represented by a TreeNode object. 

treeview.cs

using System;
using System.Drawing;
using System.Windows.Forms;

class MForm : Form {

    StatusBar sb;

    public MForm() {
        Text = "TreeView";
        Size = new Size(250, 250);

        TreeView tv = new TreeView();

        TreeNode root = new TreeNode();
        root.Text = "Languages";

        TreeNode child1 = new TreeNode();
        child1.Text = "Python";

        TreeNode child2 = new TreeNode();
        child2.Text = "Ruby";

        TreeNode child3 = new TreeNode();
        child3.Text = "Java";

        root.Nodes.AddRange(new TreeNode[] {child1, child2, child3});

        tv.Parent = this;
        tv.Nodes.Add(root);
        tv.Dock = DockStyle.Fill;
        tv.AfterSelect += new TreeViewEventHandler(AfterSelect);

        sb = new StatusBar();
        sb.Parent = this;

        CenterToScreen();
    }

    void AfterSelect(object sender, TreeViewEventArgs e)
    {
        sb.Text = e.Node.Text;
    }
}

class MApplication {
    public static void Main() {
        Application.Run(new MForm());
    }
}

هذا عرض بسيط للآداة، حيث لدينا جذر واحد وله 3 اولاد 

 TreeView tv = new TreeView();

ننشئ الآداة

 TreeNode root = new TreeNode();
 root.Text = "Languages";
 ...
 tv.Nodes.Add(root);

ننشئ الجذر

 TreeNode child1 = new TreeNode();
 child1.Text = "Python";

ننشئ الأبن (بنفس الطريقة) ونحدد النص الظاهر عليه بإستخدام الخاصية Text

 root.Nodes.AddRange(new TreeNode[] {child1, child2, child3});

يتم اضافة الأبناء الى الجذر


TreeView

Figure: TreeView

4.Directories

فى المثال التالى سنتعرض لآداة TreeView بصورة اكثر تعمقا

directories.cs

using System;
using System.Drawing;
using System.Windows.Forms;
using System.IO;       

public class MForm : Form
{
  private TreeView tv;
  private Button expand;
  private Button expandAll;
  private Button collapse;
  private Button collapseAll;
  private StatusBar sb;

  private const string HOME_DIR = "/home/vronskij";

  public MForm()
  {
    Size = new Size(400, 400);
    Text = "Directories";

    tv = new TreeView();

    SuspendLayout();

    tv.Parent = this;
    tv.Location = new Point(10,10);
    tv.Size = new Size(ClientSize.Width - 20, Height - 200);
    tv.Anchor = AnchorStyles.Top | AnchorStyles.Left | 
          AnchorStyles.Right ;


    tv.FullRowSelect = false;    
    tv.ShowLines = true;      
    tv.ShowPlusMinus = true;    
    tv.Scrollable = true;      
    tv.AfterSelect += new TreeViewEventHandler(AfterSelect);

    expand = new Button();
    expand.Parent = this;
    expand.Location = new Point(20, tv.Bottom + 20);
    expand.Text = "Expand";
    expand.Anchor = AnchorStyles.Left | AnchorStyles.Top;
    expand.Click += new EventHandler(OnExpand);

    expandAll = new Button();
    expandAll.Parent = this;
    expandAll.Location = new Point(20, expand.Bottom + 5);
    expandAll.Text = "Expand All";
    expandAll.Anchor = AnchorStyles.Left | AnchorStyles.Top;
    expandAll.Click += new EventHandler(OnExpandAll);

    collapse = new Button();
    collapse.Parent = this;
    collapse.Location = new Point(expandAll.Right + 5, expand.Top );
    collapse.Text = "Collapse";
    collapse.Anchor = AnchorStyles.Left | AnchorStyles.Top;
    collapse.Click += new EventHandler(OnCollapse);

    collapseAll = new Button();
    collapseAll.Parent = this;
    collapseAll.Location = new Point(collapse.Left, collapse.Bottom + 5);
    collapseAll.Text = "Collapse All";
    collapseAll.Anchor = AnchorStyles.Left | AnchorStyles.Top;
    collapseAll.Click += new EventHandler(OnCollapseAll);

    sb = new StatusBar();
    sb.Parent = this;


    ShowDirectories(tv.Nodes, HOME_DIR);

    ResumeLayout();

    CenterToScreen();
  }


  void AfterSelect(object sender, TreeViewEventArgs e)
  {
      sb.Text = e.Node.Text;
  }


  void ShowDirectories(TreeNodeCollection trvNode, string path)
  {
      DirectoryInfo dirInfo = new DirectoryInfo(path);
      if (dirInfo != null)
      {
          DirectoryInfo[] subDirs = dirInfo.GetDirectories();
          TreeNode tr = new TreeNode(dirInfo.Name);

          if (subDirs.Length > 0)
          {
              foreach (DirectoryInfo dr in subDirs)
              {   
                  if (!dr.Name.StartsWith("."))
                      ShowDirectories(tr.Nodes, dr.FullName);               
              }
          }
          trvNode.Add(tr);
      }
  }


  void OnExpand(object sender, EventArgs e)
  {
    tv.SelectedNode.Expand();
  }

  void OnExpandAll(object sender, EventArgs e)
  {
    tv.ExpandAll();
  }

  void OnCollapse(object sender, EventArgs e)
  {
    tv.SelectedNode.Collapse();
  }

  void OnCollapseAll(object sender, EventArgs e)
  {
    tv.CollapseAll();
  }

  static void Main() 
  {
    Application.Run(new MForm());
  }

}

فى مثالنا نعرض المجلدات الخاص مجلد المنزل فى اداة TreeView، يبدأ التطبيق مع بعض البطء لأنها تقرأ هيكلية الملفات فى مجلد المنزل اولا. ولدينا 4 ازرار على النافذة مسئولين عن مد او ضم expand/collapse



 tv.Scrollable = true;

نجعل الآداة لها سكرولبار بسبب وجود الكثير والكثير من المجلدات...

 ShowDirectories(tv.Nodes, HOME_DIR);

الطريقة ShowDirectories تملأ كل node فى الآداة بالمجلدات الموجودة



 if (subDirs.Length > 0)
 {
 ...
 }

نبحث ان كان هنا مجلدات فرعية

 foreach (DirectoryInfo dr in subDirs)
 {   
     if (!dr.Name.StartsWith("."))
         ShowDirectories(tr.Nodes, dr.FullName);               
 }

نقوم بعمل دوارة على كل المجلدات (نستخدم خوارزمية recursion) و ايضا نتخطى المجلدات المخفية -تبدأ ب نقطة ".” 



 trvNode.Add(tr);

اضافة المجلد للآداة

  void OnExpand(object sender, EventArgs e)
  {
    tv.SelectedNode.Expand();
  }

الأزرار ال 4 تم ربطهم بالطرق المناسبة، فى الكود السابق ربطنا الزر المسئول عن عملية المد expand بالطريقة expand الخاصة بال node المختار


Directories

Figure: Directories

فى هذه الجزئية انهينا العديد من الادوات المتقدمة فى WinForms

Home ‡ Contents ‡ Top of Page