نموذج التصميم ديكور

نموذج التصميم ديكور يهدف إلى توفير وسيلة لربط الحالات الجديدة والسلوك إلى كائن بطريقة ديناميكية. والكائن لا يعلم انه يجري عليه عملية ديكور "Decoration" ، الأمر الذي يجعل هذا النموذج مفيد لتطور النظم. وهناك نقطة رئيسية في تنفيذ هذا النموذج وهو انه يعمل على تزيين ال class  الاصلي و حتى المورث منه على حد سواء.

توضيح

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

التصميم

يمكن تحديد العناصر الاساسية في نموذج التصميم ديكور في رسم تخطيطي UML  كما هو موضح بالشكل ميديا:التالي|File:Decorator UML class diagram.svg|ميديا:التالي ولان هذا هو تصميمنا الأول سوف نشرحه تفصيليا . نقوم بعرض الاجزاء الاساسية في التصميم وهي:

المكونات

صف  اصلي من كائن معين سوف يضاف عليه او يتم تعديله ومن الممكن ان يكون أكثر من صف.

العمليات

العمليات في الواجهة IComponent والتي من الممكن ان تستبدل.

IComponent

هو الواجهة الذي سيقوم بتحديد هوية ال صفوف التي سيتم تزيينها.

Decorator

وهي ال صف  المشتقة من الواجهة السابقة والذي يقوم باضافة السلوك والديكور. ومن الممكن ان يكون أكثر من صف
نرى في منتصف هذا التصميم طبقة ال decorator  ومرتبطة بعلاقتين مع الواجهة IComponent 
العلاقة الاولى :
تبدأ بسهم منقط من decorator لـIComponent وهي تشير إلى ان الـ Decorator
موروثة  من  IComponent  وهذا يعني ان كائن decorator من الممكن ان تستخدم في المكان الذي تتوقع فيه استخدم الواجهة وبالتالي يمكن لل client  استخدام Component  و Decorator ديكور بالتبادل ،هذا هو اساس نموذج التصميم ديكور.
العلاقة الثانية مرسومة على شكل معيين صغير على الـ Decorator  و مرتبطة بـ  Icomponent هذا يشير إلى أن الـ Decorator  من الممكن ان يكون مرتبط بمورث  واحد أو أكثر من الـ  Component ومن الممكن في اي لحظة لواردنا جعل العمليات مختلفة ان نقوم بعمل override   وبهذه لطريقة يكون قد تحقق الهدف من النموذج

مثال

عند الرغبة في وضع  اضافتين على صورة مثلا نقوم بعمل الاتي
Photo photo = new Photo( );     
Tag  foodTag = newTag (photo, "Food",1);Tag colorTag = new Tag (foodTag, "Yellow",2);
في البداية قمنا بعمل صورة من ال class  photo بعد ذلك قمنا بالإضافة عليه بوضع foodTag  ثم قمنا بوضع اضافة اخرى على الكائن foodTag عن طريق ال colorTag
في معظم النماذج التي سنواجهها ، يمكن للعناصر الظهور في اشكال مختلفة. وللحفاظ  على مخططات UML واضحة وبسيطة ليس علينا اظهار كل الخيارات فيها ولكن علينا ان ندقق ما اذا كانت الخيارات مؤثرة في التصميم ام لا.

تعدد المكونات Multiple components

ان مختلف المكونات التي تطابق الواجهة من الممكن أيضا ان "يضاف اليها"  فمثلا من الممكن ان يكون لدينا صفوف ترسم اشخاص ومنازل وسفن من خلاص اشكال هندسية وخطوط فهذه الصفوف من الممكن أيضا ان يضاف عليها حالات من خلال الـ decorator . وهذا هو عمل الـ IComponent

الديكورات المتعددة    Multiple decorators

كما اننا من الممكن ان نورث الواجهة لاكثر من  صف كذلك يمكننا ان يكون لدينا أكثر من واجهة ولكل واحد منهم وظيفة . فاحدهما يضيف بوردر والاخر يضيف نص على الصورة وهكذا.

العمليات المتعددة Multiple operations

فالعمليات التي تجري داخل الصف او الالكائن بعض منها جزء من الكائن الاصلي والبعض من الواجهة.

المحتوى Implementation

نموذج او نمط decorator هو الذي لا يرتبط باي واجهة ليستمد حالات اخرى behaviors. فلو
ان التاج صف (وهي التي تقوم باضافة ال decor على العنصر ) ملزمة بان ترث من الواجهة للصورة مثلا لكي تحوي ميثود او اثنين فنحن بذلك نحمل التاج صف كل مايوجد في صف الصورة لكي نستفيد بهاتين الدالتين مما يجعل الكائن كبير جدا بدون داعي.

مثال عملي

يبدا المثال كما رئينا بواجهة IComponent صف بسيط موروثة من هذا واجهة وأيضا يوجد اثنين من الصف Decorator والموروثة ايصا من نفس الـ IComponent
الصف DecoratorA هي واضحة وبيسطة حيث انها لم تقوم سوى باضافة نص على العنصر الاصلي . اما الصف DecoratorB فقد قامت بنفس الوظائف الموجودة في الواجهة ولكن اضافت عليه انها اضافت متغير جديد لم يكن موجود في الواجهة وكذلك اضافت دالة جديدة.
وكما رئينا في دالة الـ Main فقد قمنا بالعمل على الصف component  أولا بدون أاستخدام DecoratorA او DecoratorB عليها ثم قمنا بعد ذلك بعرض كيفية اضافة الديكور عليها وتاثيره على اصل الصف.

ديكورات المنازل

عند البدء بتصميم منزلك لا شك أنك تبحث عن ديكورات منازل كأول خطوة , هناك أشكال وألوان عديدة لديكورات المنازل ولكل شخص ذوقه , ديكورات المنازل تتيح لك رؤية التصميم الذي ترغم ببنائه أو أن تقوم بإختيار مخططات المنازل والشكل الذي تريده عليه .

ديكورات منازل عديدة متوفرة ويمكنك الوصول إلى العديد من المصادر حول بعض الصور الخاصة بالديكورات وخاصة من خلال بعض المواقع وصفحات التواصل الإجتماعي مثل الفيسبوك أو ان تقوم بالحصول على بعض النصائح من خلال ويكيبيديا وموقع عرب ديكورmo7medelkassem186@gmail.com.
using System;class DecoratorPattern{

    // Decorator Pattern Judith Bishop Dec 2006

    // Shows two decorators and the output of various

    // combinations of the decorators on the basic component

    interface IComponent

    {

        string Operation();

    }

    ////////////////////////////////////////////////////////////

    class Component: IComponent

    {
        public string Operation()

        {
            return "I am walking ";

        }

    }///////////////////////////////////////////

   
    class DecoratorA: IComponent

    {
        IComponent component;

        public DecoratorA(IComponent c)

        {

            component = c;

        }

        public string Operation()

        {
            string s =component.Operation();

            s += "and listening to Classic FM ";

            return s;
        }

    }///////////////////////////////////////////

   
    class DecoratorB : IComponent
    {
        IComponent component;

        public string addedState = "past the Coffee Shop ";

        public DecoratorB(IComponent c)

        {
            component = c;
        }

        public string Operation()

        {

            string s =component.Operation();
            s += "to school ";
            return s;

        }

        public string AddedBehavior()

        {
            return "and I bought a cappuccino ";
        }

    }

    /// ///////////////////////////////////////////

   
    class Client

    {

        static void Display(string s, IComponent c)
        {

            Console.WriteLine(s + c.Operation());

        }

        static void Main()

        {
            Console.WriteLine("Decorator Pattern\n");

            IComponent component = new Component();

            Display("1. Basic component: ", component);

            Display("2. A-decorated : ", new DecoratorA(component));

            Display("3. B-decorated: ", new DecoratorB(component));

            Display("4. B-A-decorated : ", new DecoratorB(
            new DecoratorA(component)));

            // Explicit DecoratorB

            DecoratorB b = new DecoratorB(new Component());

            Display("5. A-B-decorated : ", new DecoratorA(b));

            // Invoking its added state and added behavior

            Console.WriteLine("\t\t\t" + b.addedState + b.AddedBehavior());
        }
    }}/* Output76 Decorator Pattern7778 1. Basic component: I am walking79 2. A-decorated : I am walking and listening to ClassicFM80 3. B-decorated : I am walking to school81 4. B-A-decorated : I am walking and listening toClassic FM to school82 5. A-B-decorated : I am walking to school andlistening to Classic FM83 past the Coffee Shop and I bought a cappuccino84 */