Соңғы жаңарту: 26.05.2019

Xamarin.Forms ішінде көрнекі интерфейс беттерден тұрады. Бет – Page класының объектісі, ол экранның бүкіл кеңістігін алады. Бұл экранда біз көріп отырған нәрсе мобильді құрылғыбет болып табылады. Қолданбада бір немесе бірнеше бет болуы мүмкін.

Бет мазмұн ретінде орналасу контейнерлерінің бірін алады, ол өз кезегінде түймелер мен мәтін ұялары сияқты стандартты көрнекі элементтерді, сондай-ақ басқа орналасу элементтерін сақтайды.

Алдыңғы тақырыпта жасалған HelloApp жобасын алайық (немесе жаңасын жасаңыз). Әдепкі бойынша, бүкіл интерфейс App.xaml.cs файлында орналасқан және ағымдағы қолданбаны көрсететін қолданба сыныбында жасалады:

Оның әдепкі коды:

Жүйені пайдалану; Xamarin.Forms пайдалану; Xamarin.Forms.Xaml пайдалану; аттар кеңістігі HelloApp (жалпыға ортақ сынып қолданбасы: қолданба (жалпыға ортақ қолданба () (InitializeComponent (); MainPage = жаңа MainPage ();) қорғалған қайта анықтау жарамсыз OnStart () (// Қолданба іске қосылған кезде өңдеу) қорғалған қайта анықтау жарамсыз OnSleep () (/ / Қолданбаңыз ұйықтап жатқанда өңдеу) қорғалған қайта анықтау жарамсыз OnResume () (// Қолданбаңыз қайта қосылған кезде өңдеу)))

Қолданба класы конструктордан басталады, ол алдымен нысанды инициализациялайтын InitializeComponent () әдісін шақырады, содан кейін MainPage сипатын орнатады. Осы сипат арқылы Қолданба сыныбы орнатылады басты бетқолданбалар. Бұл жағдайда ол HelloApp.MainPage сыныбымен, яғни MainPage.xaml және MainPage.xaml.cs файлдарында анықталған сынып арқылы анықталады.

Бірақ берілген жолжалғыз емес. Xamarin.Forms визуалды интерфейсті C # кодын пайдалана отырып және html-ге ұқсас xaml тілін немесе осы тәсілдердің тіркесімін пайдалана отырып, декларативті түрде жасауға мүмкіндік береді.

C # кодынан интерфейс құру

HelloApp жобасына біз StartPage деп атайтын кәдімгі C # сыныбын қосайық.

Және осы сыныпта келесі мазмұнды анықтаңыз:

Xamarin.Forms пайдалану; аттар кеңістігі HelloApp (сынып StartPage: ContentPage (жалпыға ортақ StartPage () (Жапсырма тақырыбы = жаңа Белгі () (Мәтін = "Xamarin Forms-тен сәлем"); this.Content = тақырып;)))

Бұл класс бетті білдіреді, сондықтан ContentPage сыныбынан мұраланады. Конструктор беттің мазмұны ретінде орнатылған мәтіні бар белгіні жасайды (this.Content = тақырып).

Негізгі бетті белгілеу үшін бастапқы бет, қолданба сыныбын өзгертейік:

Xamarin.Forms пайдалану; аттар кеңістігі HelloApp (жалпыға ортақ сынып қолданбасы: қолданба (жалпыға ортақ қолданба () (InitializeComponent (); MainPage = жаңа StartPage ();) қорғалған қайта анықтау жарамсыз OnStart () (// Қолданба іске қосылған кезде өңдеу) қорғалған қайта анықтау жарамсыз OnSleep () (/ / Қолданбаңыз ұйықтап жатқанда өңдеу) қорғалған қайта анықтау жарамсыз OnResume () (// Қолданбаңыз қайта қосылған кезде өңдеу)))

MainPage сипаты енді жаңадан жасалған StartPage бетіне нұсқайды.

Сондай-ақ, Visual Studio-да бар екенін атап өткен жөн дайын шаблонқарапайым кодпен жаңа бет сыныптарын қосу. Сонымен, жаңа бет қосу үшін жаңа элементті қосқанда Мазмұн беті үлгісін таңдаңыз (C #):

Бұл сынып қосылды негізгі жобашешімдер (бұл жағдайда HelloApp).

Қосылған бет сыныбында келесі код болады:

Жүйені пайдалану; System.Collections.Generic пайдалану; System.Linq арқылы; System.Reflection.Emit көмегімен; System.Text көмегімен; Xamarin.Forms пайдалану; аттар кеңістігі HelloApp (жалпы сынып Page1: ContentPage (жалпыға ортақ Page1 () (Мазмұн = жаңа StackLayout (Балалар = (жаңа белгі (Мәтін = "Сәлем беті"))));)))

Бұл сынып сонымен қатар негізгі ContentPage сыныбынан мұраланады және жоғарыда жасалған MainPage сыныбымен бірдей дерлік ұйымға ие болады.

Сондай-ақ қолданбалар сыныбында біз бұл бетті бастапқы бет ретінде орнатуға болады:

Xamarin.Forms пайдалану; аттар кеңістігі HelloApp (жалпыға ортақ жартылай класс Қолданба: Қолданба (жалпыға ортақ қолданба () (InitializeComponent (); MainPage = жаңа бет1 ();) // ............))

Ресей Федерациясының Білім және ғылым министрлігі

Федералдық мемлекеттік бюджеттік білім беру мекемесі

жоғары кәсіби білім

«УФА МЕМЛЕКЕТТІК МҰНАЙЫ

ТЕХНИКАЛЫҚ УНИВЕРСИТЕТ»

Информатика және инженерлік кибернетика кафедрасы

microsoft visual studio 2010 бағдарламасында графикалық пайдаланушы интерфейсі қолданбасын жасаңыз

Оқу құралы

зертханалық және практикалық сабақтарға арналған

студенттермен

230100 (09.03.01) «Информатика және есептеуіш техника»

Оқу-әдістемелік құралда теориялық мәліметтер, «Бағдарламалау» курсының практикалық және зертханалық жұмыстарына арналған тапсырмалар берілген.

Әдістемелік құрал 230100 «Информатика және компьютерлік технологиялар» бағыты бойынша пән оқытушыларына, сонымен қатар студенттерге арналған.

Құрастырған: Ғабдуллина А.А., Өнер. кафедрасының оқытушысы. VTIK

Дружинская Е.В., Арт. кафедрасының оқытушысы. VTIK

Рецензент: Филиппов В.Н., т.ғ.к., кафедра доценті. VTIK.

1. Теориялық ақпарат 4

1.1. Негізгі ұғымдар 4

1.2. Microsoft Visual Studio 2010 бағдарламасында Windows Form қолданбасын енгізу 4

1.3. 7 нысанды бақылау

1.5. MessageBox 9 функциясы

1.6. TextBox басқару элементі 10

2. Практикалық тапсырма. Microsoft Visual Studio 2010 12-де Windows Form қолданбасын енгізу

2.1. Орындалған жұмысты бағалау жүйесі 12

2.2. Тәжірибелік жұмыс тәртібі 12

3. Зертханалық жұмыс. Microsoft Visual Studio 2010 бағдарламасында қолданбаларды әзірлеу 16

3.1. Зертханалық жұмыс тәртібі 16

3.2. Тапсырма 1. Функцияны кестелеу және оның мәндерін көрсетілген аралықта 16 көрсетілген қадаммен есептеу

3.3. Жеке тапсырмалар 19

3.4. Тапсырма 2. Екі өлшемді массивтерді өңдеу 21

3.5. Жеке тапсырмалар 27

1. Теориялық ақпарат

1. 1.1. Негізгі ұғымдар

Қазіргі уақытта ақпараттық процестерді автоматтандыру, ең алдымен, деректер ағынын басқаратын графикалық пайдаланушы интерфейсі (GUI) бар бағдарламалық қосымшаны әзірлеу арқылы ұсынылған.

Графикалық пайдаланушы интерфейсі (GUI) – бұл графикалық экран құрамдас бөліктері (терезелер, түймелер, айналдыру жолағы, т.б.).

Көбінесе GUI интерфейсінің элементтері метафоралар негізінде жүзеге асырылады және олардың мақсаты мен қасиеттерін көрсетеді, бұл оқытылмаған пайдаланушыларға бағдарламаларды түсінуді және меңгеруді жеңілдетеді. Осылайша, пайдаланушының жұмысы басқару объектілері бар экран пішіндерімен және өңдеуге арналған әрекет түймелері бар құралдар тақталарымен жүзеге асырылады.

Стандартты графикалық пайдаланушы интерфейсі бірқатар талаптарға сай болуы керек:

Пайдаланушының бағдарламалық өніммен жұмысының ақпараттық технологиясын сақтау;

Сыртқы әрекеттесу деңгейінде бағдарламамен байланысатын соңғы пайдаланушыға назар аудару;

Әрқайсысы 6 опциядан аспайтын бір мәзір жолағында 6-дан көп емес ұғымды қамтитын «алтылық» принципін қанағаттандыру;

графикалық объектілердің стандартталған мақсатын және мүмкіндігінше олардың экранда орналасуын қамтамасыз ету.

Объектіге бағытталған бағдарламалауда біз класстармен және объектілермен айналысамыз. Нысандар құрамдас деректер түрлері болып табылады: олар бірнеше мәндерді бір бірлікке біріктіреді және сол мәндерді аты бойынша жазуға және сақтауға мүмкіндік береді. Басқаша айтқанда, нысан — әрқайсысының аты мен мәні бар сипаттардың ретсіз жиыны. Нысандағы аталған мәндер сандар немесе жолдар сияқты қарабайыр түрлер немесе басқа нысандар болуы мүмкін.

Консольдық емес қосымшаларды әзірлеу кезінде негізгі түсінік Form болып табылады.

Пішін әзірлеу ортасының басқару элементтерін орналастыруға арналған контейнер болып табылады.

Қасиеттер - осы элементте сақталған ақпаратқа қол жеткізу мүмкіндігі.

Әдістер - бұл объект орындай алатын әрекеттер жиынтығы.

Оқиға - бұл объект арқылы танылатын әрекет (мысалы, тінтуірді басу, пернені басу), ол үшін жауапты бағдарламалауға болады, яғни. орын алған оқиғаға объектінің реакциясы.

Қайырлы күн! Бұл оқулықта біз MS Visual Studio бағдарламасында бірінші GUI қолданбаңызды жасаймыз. Бұл графикалық қолданбаларға арналған «Hello World» түрі болады. Мен мұны бірден айтамын терезелерді пайдалануПішіндер C # бағдарламашыларына графикалық (пайдаланушының графикалық интерфейсі) қолданбаларын жасаудың жалғыз жолы емес, бірақ оқуды осы жерден бастайсыз. Сонымен, біз Visual Studio бағдарламасын іске қосамыз.

Сіз бастадыңыз ба? Содан кейін нүктеге! Біз негізгі мәзірге өтіп, төмендегі суретте көрсетілгендей «Файл - Жаңа - Жоба» тармағын таңдаймыз.

Пайда болған терезеде:

• сол жақта «Үлгілер - Visual C # - Windows» таңдаңыз;
• негізгі аймақта элементті таңдаңыз » Windows қолданбасыПішіндер »;
• терезенің төменгі жағында жобаның атын енгізіп, оның дискідегі орнын көрсетіңіз.

Жалпы, төмендегі суретте көрсетілгендей.

Сізге не қажет екенін көрсеттіңіз бе? Содан кейін «OK» түймесін басыңыз. Енді сіз келесідей нәрсені көруіңіз керек (негізгі аймақтар тіктөртбұрыштармен бөлінген):

Жоғарыдағы суретте мен негізгі аймақтарды белгіледім: конструктор аймағы (жоғарғы сол жақта), шешім зерттеушісі аймағы (жоғарғы оң жақта) және сипаттар аймағы (төменгі оң жақта). Бұл біз жиі жұмыс істейтін салалар.

Дизайнер аймағында қазір бос «форма» бар, бұл терезе деп аталады, бұл жағдайда біздің бағдарламамыздың негізгі терезесі. Сипаттар аймағында конструкторда таңдалған элементтің қасиеттері көрсетіледі, бұл жағдайда біздің пішініміз және шешімді зерттеуші аймағында жоба файлдары, соның ішінде бағдарламаның пішіндеріне (терезелеріне) қатысты файлдар бар. Енді пішінімізді сәл өзгертіп, осы бірінші қолданбаны іске қосамыз.

Ол үшін конструктордағы пішінді таңдаңыз (ол үшін пішінді тінтуірдің сол жақ батырмасымен шертуге болады) және сипаттар блогына өтіңіз, онда біз «Мәтін» жолын табамыз (біз іздейтін мәтін сөзі) сол бағанда) төмендегі суретте көрсетілгендей.

Өтініштің негізгі формасының «Мәтін» қасиеті

Сол жақ бағанда атау (сипат атауы), ал оң жақ бағанда оның мәні бар екенін ескеріңіз.

Бұл жағдайда біз мәтіндік сипатпен жұмыс істейміз және оның мәні терезенің тақырыбында көрсетіледі, сондықтан енді сол жерде өзімізге тән нәрсені көрсетейік, мысалы, төмендегі суретте көрсетілгендей: «Негізгі терезе»:

Енді сіз жобаны құрастырып, оны іске қоса аласыз. Ол үшін негізгі мәзірге өтіп, «Құру - Шешім құрастыру» тармағын таңдаңыз. Содан кейін біз қосымшаны іске қосамыз, ол үшін негізгі мәзірде «Отлад - отладкасыз бастау» тармағын таңдаймыз. Нәтижесінде сіз келесі терезені көруіңіз керек.

Келесі сабақта біз қарастырамыз қарапайым жұмыспішін дизайнерімен және элементтерді теңшеу графикалық интерфейс, және бұл сабақ аяқталды, біз бірінші графикалық қосымшаны жасап, оны құрастырып, іске қостық.

5

Мен Nintendo DS үшін GUI жүйесінің түймелер, мәтіндік ұяшықтар және құсбелгілер сияқты көптеген әртүрлі бөлімдерін жасадым, бірақ маған экранда барлығын бірден сызып, тексеруге болатындай етіп бір Gui сыныбында осы сыныптарды жасырудың жолы қажет. кез келген түймелердің басылғанын тексеру үшін барлық түймелерді бірден басыңыз. Менің сұрағым, барлық сыныптарды (мысалы, түймелер мен мәтіндік жолақтар) бір GUI сыныбына ұйымдастырудың ең жақсы жолы қандай?

Міне, мен ойладым, бірақ бұл дұрыс емес сияқты:

Өңдеу:Мен C ++ пайдаланамын.

Gui класы (жалпыға ортақ: барлық жаңарту_барлығы (); void draw_all () const; int add_button (түйме * түймесі); // Түйменің идентификаторы void remove_button (int button_id) қайтарады); private: Button * түймелері; int num_buttons;)

Бұл кодта бірнеше мәселе бар, бірақ мен сізге не қалайтыным туралы түсінік бергім келді.

• 5 жауап

Сұрыптау:

Белсенділік

2

Бұл сұрақ мен жариялағалы тұрған сұраққа өте ұқсас, тек менікі Sony PSP бағдарламалауға арналған.

Мен біраз уақыттан бері бірдеңе іздеп жүрмін, мен бірнеше кітаптар мен VTM-лермен кеңестім, әзірге бұл өрескел идея қарапайым жүйелер ui.

uiElement () класы (... виртуалды жарамсыз Жаңарту () = 0; виртуалды жарамсыз Draw () = 0; ...) uiButton () жалпыға ортақ: uiElement (... виртуалды бос Жаңарту (); виртуалды бос Draw () ; ...) сынып uiTextbox () public: uiElement (... virtual void Update (); virtual void Draw (); ...) ... // Басқа ui элементтері класы uiWindow () (... void Жаңарту (); void Draw (); void AddElement (uiElement * Элемент); void RemoveElement (uiElement * Элемент); std :: тізім Элементтер; ...) void uiWindow :: Жаңарту () (... үшін (тізім.). :: итератор it = Elements.begin (); = Elements.end (); it ++) it-> Update (); ...) void uiWindow :: Draw () (... үшін (тізім :: итератор it = Elements.begin (); = Elements.end (); it ++) it-> Draw (); ...)

принципі терезе мен аттакты элементтерін жасау болып табылады пайдаланушы интерфейсіоған және сәйкес негізгі функциялардан көрсету және жаңарту әдістерін шақырыңыз.

Мен үшін әлі ештеңе жұмыс істемейді, өйткені менде сызба кодымен проблемалар бар. ДК және PSP-дегі әртүрлі API интерфейстерімен мен OpenGL және psp gu үшін орауыш кодын өткізіп жатырмын.

Бұл көмектеседі деп үміттенеміз.

0

Бір пайдалы стратегия композициялық үлгі болуы мүмкін. Төмен деңгейде ол жасалғаннан кейін барлық GUI нысандарын (және нысандардың жинақтарын) оңай өңдеуге мүмкіндік береді. Бірақ мен GUI дизайнына не қатысы бар екенін білмеймін, сондықтан жалпы шабыт табудың бір орны бар жобаның бастапқы кодында. WxWidgets – қолжетімді интерфейсі бар кросс-платформалық GUI бастапқы код... Жобаңызға сәттілік!

0

3

Қызығушылық танытқандар үшін міне менің ашық көзім, DS үшін BSD лицензиясы бар GUI құралдар жинағы:

Subject2k жауабы өте жақсы, бірақ мен негізгі uiElement сыныбында еншілес интерфейс элементтерін қамтитын кодтың болуын ұсынамын. Бұл мен Вупсиде ұстанған үлгі.

Егер сіз емесоны базалық сыныпта қолдасаңыз, мәтіндік жәшік пен түймеден күрделірек нәрсені іске асыруға тырысқанда күрделі мәселелерге тап боласыз. Мысалы:

• Кестелік панельдерді бір топқа топтастырылған бірнеше түймелер ретінде модельдеуге болады негізгі элементтаңдаудың өзара эксклюзивтілігін қамтамасыз ететін пайдаланушы интерфейсі;
• Радиостанциялардың топтары (уақыт бойынша);
• Айналдыру жолақтары сырғытпа / науа элементі және жоғары / төмен түймелері ретінде ұсынылуы мүмкін;
• Айналдыру тізімдерін контейнер және бірнеше пайдаланушы интерфейсі элементтері ретінде ұсынуға болады.

Сондай-ақ, DS жүйесінде 66 МГц процессоры және 4 МБ жедел жады бар екенін есте ұстаған жөн, ол сіздің бағдарламаңызды сақтауға және оны іске қосуға арналған (DS дискілері олар іске қосылмас бұрын жедел жадқа жүктеледі). Сіз оны ендірілген жүйе ретінде қарастыруыңыз керек, яғни STL жоқ. Мен Woopsi-тен STL-ді алып тастадым және 0,5 МБ сақтай алдым. Жұмыс үстелі стандарттары бойынша көп емес, бірақ бұл STL қоқыстары тұтынатын жалпы қолжетімді DS жадының 1/8 бөлігін құрайды.

Мен блогымда пайдаланушы интерфейсін жазудың бүкіл процесін егжей-тегжейлі айтып бердім:

Ол экранды қайта сызу үшін мен ойлап тапқан екі алгоритмнің сипаттамасын қамтиды, бұл графикалық интерфейсті құрудың қиын бөлігі (біреуі тіктөртбұрыштарды бұзып, көрінетін аумақтарды есте сақтайды, ал екіншісі BSP ағаштарын пайдаланады, бұл әлдеқайда тиімді және түсіну оңай), оңтайландыру бойынша кеңестер және т.б. .d.

Бұл мақалада біз C++ тіліндегі пішіндерді пайдаланып ең қарапайым қолданбаларды құруға назар аударамыз. Мен бірден түсіндіргім келеді: «форма» C++ қосымшаларын әзірлеу Microsoft Visual Studio ортасында жүзеге асырылады (біз Borland Software компаниясының негізгі бәсекелесін айналып өтеміз). Айта кету керек, Visual Studio-да пішіндермен қосымшаны жасаудың екі жолы бар, шешім жаңа жобаны құру кезінде қабылданады.

Біріншісі, графикалық пайдаланушы интерфейсін жүзеге асыратын және Microsoft .NET Framework бөлігі болып табылатын Windows Forms бағдарламасын пайдалану. Бұл тәсіл интерфейс элементтеріне қол жеткізуді жеңілдетеді Microsoft Windows Win32 API басқарылатын кодқа орау арқылы. Егер сіз өз ойларыңызды неғұрлым түсінікті түрде енгізсеңіз, онда бұл тәсіл консольдік қосымшаны құруға өте ұқсас, бірақ сәл күрделірек, өйткені пішіндерді пайдаланады.

Екінші жол негізделген Microsoft көмегімен Foundation Classes (MFC), қолданбаның қаңқасын құрумен айналысатын кітапхана. Біріншіден айырмашылығы, MFC қораптан тыс MVC (Model-View-Cont ролик) үлгісін пайдаланады. Бұл тәсіл біріншіге қарағанда күрделірек, бірақ оның негізінде сіз өте оңай негіз жасай аласыз қызықты қолданбалар, Мысалыға, мәтіндік редакторнемесе Ribbon компонентін пайдаланыңыз және мәзірді атышулы MS Office 2010 бағдарламасындағыдай жасаңыз.

MS Visual Studio бағдарламасында қосымша құру

Жаңа қосымшаны жасайық: File-> New-> Project. Пайда болған терезеде, жоғарыдағы суреттегідей, Windows Forms Application тармағын тауып, таңдаңыз, содан кейін жаңа жобаның атын (app1) және орнын көрсетіңіз және оны жасауды «OK» түймесін басу арқылы растаңыз.

Тікелей бағдарламалауға кіріспес бұрын, оқиғаның не екенін түсінуіңіз керек. Оқиға - белгілі бір жағдайларда болатын әрекет. Ең қарапайым (және ең кең таралған) жүктеу, басыңыз деп санауға болады ... олардың кейбірін толығырақ қарастырайық:

• Белсендірілген – элемент белсендірілген кезде болатын оқиға.
• Басу - элементті бір рет шерткен кезде пайда болады.
• DoubleClick – элементті екі рет шертіңіз.
• HelpRequested – пернені басқан кезде іске қосылады .
• Бояу - элемент қайта боялған кезде көтеріледі.
• MouseLeave – оқиға курсор элемент шекарасынан шыққан кезде іске қосылады.

Элементке тән оқиғалар оның түріне байланысты екенін ұмытпаңыз. Нысан үшін барлық қолжетімді оқиға пішіндерін көру үшін оны таңдап, сипаттар терезесінде найзағай белгішесін таңдаңыз. Төменде Form1 элементіне арналған оқиғалардың кейбірі көрсетілген. Көріп отырғаныңыздай, Form1_Load функциясы Жүктеу оқиғасы үшін таңдалған, сондықтан осы функциядағы код пішін жүктелген кезде шақырылады.

Form1.h файлын ашыңыз, келесідей код болады:

Жеке: Жүйе :: Void Form1_Load (Жүйе :: Нысан ^ жіберуші, Жүйе :: EventArgs ^ e) ()

Бұл пішін жүктелген кезде іске қосылатын бірдей Form1_Load функциясы. Мұны пішінге TextBox компонентін қосу арқылы көрейік.

Ол үшін пішін ресурсын ашып, оны таңдаңыз. Содан кейін Құралдар жинағы құралдар тақтасын таңдап, TextBox компонентін пішінге сүйреңіз. Form1_Load функциясын келесідей өзгертіңіз:

Жеке: Жүйе :: Жарамсыз Form1_Жүктеу (Жүйе :: Нысан ^ жіберуші, Жүйе :: EventArgs ^ e) (textBox1-> Мәтін = «Сәлеметсіз бе, Әлем!»; // textBox1 - сіз қосқан өріс мәтінінің атауы)

Жобаны іске қосыңыз, сіз келесі хабарламамен аяқталуыңыз керек:

Әзірше осымен, келесі сабақтарда жалғасын тапты.