كيف أقوم بعمل واجهة المستخدم الرسومية؟

Question

لقد قمت بإنشاء العديد من الأجزاء المنفصلة المختلفة لنظام واجهة المستخدم الرسومية لجهاز Nintendo DS، مثل الأزرار ومربعات النص ومربعات التحديد، ولكنني بحاجة إلى طريقة لاحتواء هذه الفئات في فئة واجهة مستخدم رسومية واحدة، حتى أتمكن من رسم كل شيء على الشاشة في كل مكان مرة واحدة، وتحقق من جميع الأزرار مرة واحدة للتحقق من الضغط على أي منها.سؤالي هو ما هي أفضل طريقة لتنظيم جميع الفئات (مثل الأزرار ومربعات النص) في فئة واحدة لواجهة المستخدم الرسومية؟

إليك طريقة واحدة فكرت بها ولكنها لا تبدو صحيحة:

يحرر: أنا أستخدم C++.

class Gui {
    public:
        void update_all();
        void draw_all() const;
        int add_button(Button *button); // Returns button id
        void remove_button(int button_id);
    private:
        Button *buttons[10];
        int num_buttons;
}

يحتوي هذا الرمز على بعض المشاكل، لكني أردت فقط أن أقدم لك فكرة عما أريده.

Answer 1

هذا السؤال مشابه جدًا للسؤال الذي كنت سأقوم بنشره، لكن سؤالي الوحيد مخصص لبرمجة Sony PSP.

لقد كنت أتلاعب بشيء ما لفترة من الوقت، وقد استشرت بعض الكتب و أجهزة VTM, ، وحتى الآن هذه فكرة تقريبية لأنظمة واجهة المستخدم البسيطة.

class uiElement()
{
    ...
    virtual void Update() = 0;
    virtual void Draw() = 0;
    ...
}

class uiButton() public : uiElement
{
    ...
    virtual void Update();
    virtual void Draw();
    ...
}

class uiTextbox() public : uiElement
{
    ...
    virtual void Update();
    virtual void Draw();
    ...
}

... // Other ui Elements

class uiWindow()
{
    ...
    void Update();
    void Draw();

    void AddElement(uiElement *Element);
    void RemoveElement(uiElement *Element);

    std::list <uiElement*> Elements;

    ...
}

void uiWindow::Update()
{
    ...
    for (list <uiElement*>::iterator it = Elements.begin(); it != Elements.end(); it++ )
        it->Update();
    ...
}

void uiWindow::Draw()
{
    ...
    for (list <uiElement*>::iterator it = Elements.begin(); it != Elements.end(); it++ )
        it->Draw();
    ...
}

المبدأ هو إنشاء نافذة وإحضار عناصر واجهة المستخدم إليها، واستدعاء أساليب السحب والتحديث من الوظائف الرئيسية المعنية.

ليس لدي أي شيء يعمل حتى الآن، حيث أواجه مشكلات في رسم التعليمات البرمجية.مع واجهات برمجة التطبيقات المختلفة على الكمبيوتر الشخصي وPSP، فإنني أبحث عن بعض التعليمات البرمجية المجمعة لـ OpenGL وpsp gu.

أتمنى أن يساعدك هذا.

thing2k

Answer 2

لأي شخص مهتم، إليك مجموعة أدوات واجهة المستخدم الرسومية مفتوحة المصدر والمرخصة من BSD لـ DS:

http://www.sourceforge.net/projects/woopsi

إجابة thing2k جيدة جدًا، لكنني أوصي بشدة بالحصول على تعليمات برمجية تحتوي على عناصر واجهة المستخدم الفرعية في فئة uiElement الأساسية.هذا هو النمط الذي اتبعته في Woopsi.

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

• يمكن تصميم أشرطة علامات التبويب كأزرار متعددة مجمعة معًا في عنصر واجهة مستخدم أصلي واحد يفرض التفرد المتبادل في التحديد؛
• مجموعات أزرار الاختيار (كما سبق)؛
• يمكن تمثيل أشرطة التمرير كعنصر تمرير/ميزاب وأزرار لأعلى/لأسفل؛
• يمكن تمثيل قوائم التمرير كحاوية وعناصر واجهة مستخدم متعددة الخيارات.

ومن الجدير بالذكر أيضًا أن DS يحتوي على وحدة معالجة مركزية تبلغ سرعتها 66 ميجاهرتز وذاكرة وصول عشوائي (RAM) تبلغ 4 ميجابايت، والتي تُستخدم لتخزين البرنامج وتنفيذه (يتم تحميل أقراص DS ROM في ذاكرة الوصول العشوائي (RAM) قبل تشغيلها).يجب أن تتعامل معه حقًا كنظام مضمن، مما يعني أن المحكمة الخاصة بلبنان قد انتهت.لقد قمت بإزالة STL من Woopsi وتمكنت من توفير 0.5 ميجابايت.ليس كثيرًا وفقًا لمعايير سطح المكتب، ولكن هذا يمثل 1/8 من إجمالي الذاكرة المتوفرة لـ DS التي تستهلكها ملفات STL غير المرغوب فيها.

لقد قمت بتفصيل العملية الكاملة لكتابة واجهة المستخدم على مدونتي:

http://ant.simianzombie.com/blog

يتضمن وصفًا للخوارزميتين اللتين توصلت إليهما لإعادة رسم الشاشة، وهو الجزء الأكثر صعوبة في إنشاء واجهة المستخدم الرسومية (واحدة فقط تقسم المستطيلات وتتذكر المناطق المرئية؛والآخر يستخدم أشجار BSP، وهي أكثر كفاءة وأسهل في الفهم)، ونصائح للتحسين، وما إلى ذلك.

Answer 3

قد تكون إحدى الإستراتيجيات المفيدة التي يجب وضعها في الاعتبار هي نمط مركب.على مستوى منخفض، قد يسمح لك بمعالجة كافة كائنات واجهة المستخدم الرسومية (ومجموعات الكائنات) بسهولة أكبر بمجرد إنشائها.لكن ليس لدي أي فكرة عما يتضمنه تصميم إطار عمل واجهة المستخدم الرسومية، لذا فإن أحد الأماكن التي يمكن أن تجد فيها الإلهام العام هو الكود المصدري لمشروع موجود. WxWidgets هو إطار واجهة المستخدم الرسومية عبر الأنظمة الأساسية مع توفر المصدر.حظا سعيدا مع المشروع الخاص بك!

Answer 4

أعتقد أن النظر إلى الطريقة التي اتبعتها مجموعات أدوات واجهة المستخدم الرسومية الأخرى سيكون مكانًا ممتازًا للبدء.بالنسبة لأمثلة C++، أسمع الكثير من الأشياء الجيدة عنها كيو تي.بالرغم من ذلك لم أستخدمه شخصيًا.وبالطبع WxWidgets كما ذكر نيك.

Answer 5

لقد كتبت واجهة مستخدم رسومية بسيطة جدًا تمامًا كما تقترح.لقد قمت بتشغيله على أنظمة التشغيل Windows و Linux و Macintosh.يجب أن ينتقل بسهولة نسبيًا إلى أي نظام مثل PSP أو DS أيضًا.

إنه مفتوح المصدر، LGPL وهو موجود هنا:

http://code.google.com/p/kgui/