Laboratorium Podstaw Informatyki
Kierunek Elektrotechnika
Ćwiczenie 4.1
Interfejs z użytkownikiem
Okna, menu, komunikaty
Zakład Metrologii AGH
Kraków 1997
Wprowadzenie
Interfejs z użytkownikiem jest tym elementem programu, który decyduje o jego funkcjonalności i przystępności. Jednocześnie jest to element, któremu programiści poświęcają najwięcej czasu. Przy jego konstrukcji szczególną uwagę należy zwracać na łatwość obsługi, jeśli użytkownik jest początkującym, a na szybkość obsługi jeśli użytkownik jest zaawansowany. Według zasady łatwości obsługi skonstruowany jest interfejs MS Windows, ze względu na masowość sprzedaży i użytkowania tego środowiska. Na przeciwnym końcu znajduje się interfejs użytkownika programu edycji plików tekstowych vi w systemach UNIX-owych. Wywoływanie komend skrótami literowymi jest trudne do opanowania, ale znacznie przyśpiesza pracę po zapoznaniu się z nimi. Często spotyka się połączenie tych dwóch podejść w aplikacjach, w których opcje menu dostępne są do wyboru myszką lub przez naciśnięcie klawisza skrótu (ang. hot key).
Zadanie 1 - elementy podstawowe
Podstawowym elementem interfejsu użytkownika wg. obowiązującej współcześnie mody jest okno. Wyróżnia się je z tła dla osiągnięcia czytelności przekazywanej informacji przez otoczenie je ramką lub zastosowanie kolorów. Poza przekazywaniem informacji do użytkownika, w oknach użytkownik wprowadza dane i polecenia dla programu.
Zorganizowany sposób sterowania programem przybrał postać wyboru z menu dokonywanego przesuwaną klawiszami belką (podświetleniem pozycji) lub wciśnięciem klawisza skrótu (ang. hot key). Menu może mieć układ pozycji poziomy, jak menu główne środowiska programowania Borland C, lub układ pionowy, jak menu użytkownika powłoki Norton Commander.
Opracowana w czasach świetności DOS-a postać elementów interfejsu użytkownika znalazła swoje odbicie w systemach operacyjnych z graficznym interfejsem użytkownika. Ciągle używane są elementy typu hierarchiczne, rozwijane menu czy formatka z polami do wprowadzania rekordów danych. Jest to przejaw ciągłości przyzwyczajeń programistów i użytkowników. Obserwuje się jednak ewolucję elementów interfejsu w stronę przekazu obrazkowego, co widać np. w coraz bardziej rozbudowanej postaci paska narzędzi edytorów tekstu MS Word.
Okno z ramką
Program ramki tworzy na ekranie obrysowane okno. Wyświetlany jest w nim tekst i pobierana jest informacja od użytkownika. Wszelkie operacje związane z wyświetlaniem tekstu ograniczone są do obszaru okna utworzonego funkcją biblioteczną window(). Konieczne jest jednak używanie funkcji cprintf(), cgets() zadeklarowanych w pliku nagłówkowym conio.h i przeznaczonych dla konsoli, zamiast ich odpowiedników z stdio.h przeznaczonych dla standardowego wejścia/wyjścia. Kolor tła i tekstu można określić dla obszaru okna funkcją textattribute(). Funkcja clrscr() czyści zawartość otwartego okna.
W programie ramki brakuje kolorów. Dodaj parametr wywołania funkcji OknoOtworz() określający kolor tła, napisów i opcję migotania wg. standardu wywołania funkcji textattribute(). Utwórz okno z zielonym tłem i czarnymi napisami, bez migotania. |
Zawarte w programie ramki funkcje są tylko namiastką użytecznej biblioteki. Podstawowym mankamentem jest brak możliwości zamykania utworzonego okna, co jest związane z działaniem bibliotecznej funkcji window(). Zamykanie okna wiąże się z koniecznością odtworzenia poprzedniej zawartości ekranu na obszarze pod oknem. Umożliwiają to funkcje biblioteczne, użyte w programie z następnego zadania w funkcji Komunikat(). Poważniejsze problemy stwarza zamykanie jednego z wielu nałożonych na siebie okien. Ćwiczący będzie miał okazję rozwiązać te problemy wykonując zadanie dodatkowe.
Menu
Wybór przez użytkownika operacji do wykonania przez program można obsłużyć w dedykowanym do tego zadania module wyboru opcji. Sposób przekazania dostępnych do wyboru opcji jest sprawą definicji typów i funkcji modułu. Sposób prezentacji na ekranie opcji do wyboru i pobierania wyboru użytkownika jest sprawą implementacji i może być modyfikowany, bez konieczności zmian w modułach wykorzystujących moduł wyboru opcji.
Na etapie projektowania modułu określić trzeba sposób reakcji modułu na wybór. Konstrukcyjnie najprostsze jest zwrócenie numeru wybranej opcji, z wyróżnioną wartością dla rezygnacji z wyboru. W tym przypadku reakcja na wybór jest wywoływana spoza modułu wyboru opcji. Inne rozwiązanie to przypisanie do każdej z opcji funkcji, która powinna być wywołana po wyborze danej opcji. Wskaźnik na funkcję może być określany w module wywołującym w momencie definicji opcji menu. Przez powiązanie kolejnych opcji z akcją do wykonania, a nie z numerem, otrzymujemy przejrzysty zapis wywołania funkcji wyboru z menu w module wywołującym.
Usuń wywołanie funkcji PokazOpcje() z głównej pętli przetwarzania. Dodaj do struktury POZYCJA_MENU pole wskaźnika na funkcję typu void (*akcja)(char*). Uzupełnij definicje pozycji menu o wskaźnik na funkcję PokazOpcje(). Po wyborze danej pozycji menu wywołaj z funkcji obsługi menu wskazywaną funkcję ze składową tekst jako parametrem wywołania. Jeśli wskaźnik na funkcję ma wartość NULL, czyli nie podano akcji związanej z opcją, zwróć sterowanie do modułu wywołującego. |
Po wykonaniu powyższego zadania proste już jest zorganizowanie hierarchicznego, rozwijanego menu. Rozwinięcie danej opcji w następne menu do wyboru (ang. pulldown menu) można zrealizować np. w funkcji powiązanej z opcją.
Zadanie 2 - biblioteka funkcji interfejsu z użytkownikiem
Ze względu na dużą ilość czasu poświęcaną przez programistów na obsługę komunikacji z użytkownikiem, powstało wiele rozwiązań obsługujących elementy interfejsu na poziomie ekranu i klawiatury i tworzących platformę programowania na wyższym poziomie z elementami typu okno, menu, przycisk, komunikat. Elementy interfejsu z użytkownikiem dobrze pasują do modelu obiektowego, w którym obiekt posiada pewne atrybuty (w tym przypadku to jest np. kolor czy ilość pozycji menu) i udostępnia operacje (np. wybór pozycji z menu lub wyświetlenie okna na ekranie. Stąd duża ilość obiektowych bibliotek funkcji tworzenia interfejsu użytkownika, jak Turbo Vision dla MS-DOS, MFC dla MS Windows. Graficzne projektowanie interfejsu z ręcznym umieszczaniem poszczególnych elementów na panelu sterowania również przyśpiesza pracę. Takie rozwiązanie przyjęto w pakiecie Visual C/C++.
Spośród mnogości bibliotek funkcji do tworzenia interfejsu z użytkownikiem wybrano dostępną bezpłatnie dla modelu pamięci small bibliotekę CXL. Jest ona umieszczona np. w archiwum Simtel znajdującym się w Akademickim Centrum Komputerowym CYFRONET-Kraków (ftp://ftp.cyf-kr.edu.pl/pub/mirror/Simtel.Net/msdos). Zawiera ona ponad 260 funkcji do tworzenia i obsługi elementów interfejsu z użytkownikiem. Szczegółowy opis zawarty w pliku cxl.doc dostarcza informacji o składni wywołania i sposobie działania funkcji z biblioteki.
System okien
Wykorzystana w programie okna biblioteka cxl zawiera funkcje obsługi okien w zakresie otwierania, przesuwania, kopiowania, ukrywania i zamykania. Użytkownik wskazuje okno, na którym ma być wykonana operacja identyfikatorem przekazanym przez biblioteczną funkcję otwarcia okna. Większość operacji dotyczy aktualnego okna, co ułatwiło implementację autorom biblioteki. Działanie programu okna polega na wypisywaniu w oknie w postaci heksadecymalnej wartości znaków wpisywanych w drugim oknie.
Dodaj do programu okna winietkę informującą przy uruchamianiu programu o jego nazwie, aktualnym czasie (funkcja gettime()) i nazwiskach ćwiczących. Winietka powinna zniknąć po naciśnięciu dowolnego klawisza. |
Operacja pisania do okna jest wykonywana dla okna aktualnego. Stąd potrzeba przełączania aktywnego okna na czas pisania. W okienkowych środowiskach wieloprogramowych, jak X-Windows czy MS Windows, konieczna jest aktualizacja zawartości okien nawet jeśli nie są one w danym czasie aktywne. Stąd w bibliotekach graficznych do tych systemów pisanie do okna jest wykonywane z użyciem identyfikatora (ang. handler) docelowego okna.
Rozwijane menu
Sposobem na opanowanie mnogości opcji dostępnych do wyboru jest wprowadzenie do menu struktury hierarchicznej. Dana opcja jest dostępna w takim rozwiązaniu po serii wyborów opcji w kolejnych, rozwijanych menu. Program menubib wykorzystuje funkcje biblioteki cxl do utworzenia jednopoziomowego menu wyboru. Operacja do wykonania po wyborze danej opcji jest kodowana w funkcji, której nazwa (wskaźnik na funkcję) jest parametrem funkcji wmenuitem() tworzącej pozycję menu. Używana biblioteka zapewnia wywołanie tej funkcji po wyborze opcji. Podanie pustego wskaźnika powoduje opuszczenie menu po wyborze odpowiadającej mu opcji, chyba że podano w parametrze fmask funkcji wmenuitem() opcję M_HASPD oznaczającą istnienie podmenu (ang. pull-down menu) dla tej opcji. W takim przypadku otwarte zostanie do wyboru zdefiniowane podmenu.
Dodaj dla opcji Modyfikacja danych podmenu z opcjami Dodanie, Zmiana, Usuniecie. Zdefiniuj funkcję void WybralesPodmenu(void) i ustaw wskaźnik na nią dla opcji w utworzonym podmenu. |
Poza funkcją wykonywaną po wybraniu danej opcji, biblioteka cxl umożliwia specyfikowanie akcji wykonywanych przed przesunięciem belki wyboru na daną opcję i przed przesunięciem belki na następną opcję. Służy temu funkcja wmenuiba() z parametrami before i after typu wskaźnik na funkcję.
Możliwe jest również ustawianie stanu opcji na nieaktywną, co objawia się odmiennym wyświetlaniem opcji i brakiem możliwości jej wyboru. Stan opcji ustawia para funkcji wmenuidsab() i wmenuienab().
Zadanie 3 - pobieranie informacji i podręczna pomoc
Pozostały nam dwa elementy interfejsu użytkownika, blisko ze sobą związane: obsługa wprowadzania informacji przez użytkownika i wykorzystywana najczęściej w tym kontekście podręczna pomoc. Następujące zadania omawiają te zagadnienia na przykładzie gotowej biblioteki. Implementacja tych elementów interfejsu od podstaw jest żmudnym zajęciem i niepotrzebnym wobec dużej ilości gotowego do wykorzystania kodu i dedykowanych narzędzi przygotowania interfejsu użytkownika.
Pobieranie informacji
Przyjętym sposobem pobierania informacji od użytkownika, przy wielu polach składających się na rekord danych, jest wpisywanie danych przez użytkownika w formularzu nazywanym formatką (ang. form), którego pola odpowiadają polom rekordu. Dopuszczalne jest przesuwanie się po polach formatki w przód i w tył. Po wpisaniu wszystkich danych akceptowany przez użytkownika jest cały rekord. Weryfikacja danych następuje po każdym polu i/lub dla całego rekordu.
Biblioteka cxl zawiera funkcje do obsługi formatek: winpbeg(), winpdef() i winpget(). Możliwa jest specyfikacja formatu przyjmowanych przez pole danych. Weryfikacja jest przeprowadzana po wpisaniu danych do pola, przez dostarczoną przez użytkownika biblioteki funkcję. Zmienne związane z polami formatki mogą być tylko tekstowe. Konieczne konwersje na i z innych typów danych przeprowadza użytkownik. Wprowadzaniu rekordów danych z użyciem formatek jest poświęcony rozdział Multi-Field Input Functions dokumentacji biblioteki cxl.
Program formatka przyjmuje dane od użytkownika i weryfikuje ich poprawność zgodnie z typem pola i zadanymi ograniczeniami. Dodaj do typu opisującego studenta pole grupa_studencka na zapamiętanie trzyznakowego oznaczenia grupy. Obsłuż wprowadzanie informacji do tego pola w formatce. Dodaj funkcję weryfikacji wprowadzonych danych. Oznaczenie grupy składa się z jednej dużej litery i dwóch cyfr, np. E53. Cyfry nie mogą razem tworzyć liczby mniejszej niż 50. |
Pomoc dla użytkownika
Dobrym zwyczajem jest udostępnianie użytkownikowi podręcznej pomocy na temat użytkowania programu, poza instrukcją obsługi programu dostępną w postaci drukowanej. Pomoc ta dostępna jest w czasie działania programu po naciśnięciu wyróżnionego klawisza lub po wybraniu opcji pomocy. Powszechnie stosowany, elastyczny sposób implementacji pomocy podręcznej polega na umieszczeniu tekstów pomocy na zewnątrz programu, w oddzielnym pliku pomocy. Poszczególne teksty pomocy są oznaczane identyfikatorem (np. wartością liczbową), za pomocą którego następuje w programie odwołanie do tekstu pomocy. Dla osiągnięcia dużej szybkości wyszukiwania odpowiedniego tekstu pomocy, plik pomocy jest indeksowany, tzn. dla każdego identyfikatora pomocy zapisane jest położenie początku tekstu pomocy.
W bibliotece cxl zastosowano koncepcję aktywnej kategorii pomocy. Po naciśnięciu zdefiniowanego klawisza pomocy wyświetlany jest w otwieranym oknie tekst pomocy o identyfikatorze równym aktywnej kategorii. Aktywną kategorię można zdefiniować np. dla okna, pola formatki lub opcji menu. Opis formatu pliku pomocy i sposobu tworzenia odnośników (ang. cross-reference) zawarty jest w dokumentacji biblioteki w rozdziale Context-Sensitive Help Functions.
Opcje podmenu Modyfikacja programu student nie są opisane w pliku pomocy. Dodaj opisy do pliku student.asc, indeksuj plik programem makeindx i dodaj w źródłach programu identyfikatory tekstów pomocy dla opcji podmenu. |
Dla tych, którzy chcą wiedzieć więcej - informacje dodatkowe
Biblioteki funkcji i narzędzia projektowania interfejsu użytkownika
Historia narzędzi wspomagających tworzenie interfejsu użytkownika zaczęła się od bibliotek funkcji w rodzaju cxl. Duża ilość funkcji i duża ilość parametrów wywołania tych funkcji była przeszkodą w szybkim tworzeniu interfejsów.
W niedługim czasie po powstaniu obiektowego języka C++ zastosowano metodę obiektową do implementacji obiektów odpowiadających elementom interfejsu z użytkownikiem. Zamknięcie w obiektach atrybutów (np. kolor, rodzaj ramki, aktualna pozycja menu) i metod (wybór opcji z menu, ukrycie okna) uporządkowało strukturę bibliotek. Domyślne wartości składowych obiektów uprościły wywołania funkcji bibliotek. Przykładem obiektowej biblioteki do tworzenia interfejsu z użytkownikiem w środowisku DOS jest Turbo Vision firmy Borland dostępna z wersją C++ 3.1.
Następnym krokiem było wyodrębnienie opisu elementów interfejsu ze źródeł programu w języku C. Dzięki temu że elementy, które odpowiadają za kontakt z użytkownikiem opisane są w oddzielnym pliku, łatwiejsza jest ich modyfikacja i możliwe jest zastosowanie narzędzi projektowania interfejsu. Aplikacje typu Resource Workshop dostępne z kompilatorami do aplikacji Windows (Borland C++ 3.1, Microsoft C 6.0) realizują ten sposób projektowania interfejsu. Element interfejsu opisany w pliku zasobów typu RES jest wywoływany z użyciem jego identyfikatora.
Ostatnim krokiem na drodze ewolucji narzędzi projektowania interfejsu użytkownika było ściślejsze powiązanie źródeł w języku C++, a konkretnie klas odpowiadających obiektom interfejsu z tymi obiektami opisanymi w pliku zasobów. Automatyczne wyszukiwanie kodu związanego z danym obiektem, symboliczne mapy komunikatów, generowanie szkieletu aplikacji z początkowym interfejsem użytkownika, decydują o przewadze narzędzi środowiska Visual C++, które posiada te własności, nad starszymi środowiskami programowania.
Dla tych, którzy chcą być najlepsi - zadania dodatkowe
Automatyczne łączenie przecinających się linii elementów interfejsu
W hipotetycznym programie projektowania interfejsu użytkownika wygląd panelu sterującego jest określany przez użytkownika za pomocą myszki. Dużym ułatwieniem obsługi jest automatyczne łączenie przy rysowaniu przecinających się linii elementów interfejsu. Dla przykładu narysowanie linii poziomej i pionowej dla osiągnięcia podziału okna na cztery części, wiąże się z połączeniem obu linii w miejscu przecięcia odpowiednim znakiem semigraficznym zależnym od rodzaju linii.
Zaimplementuj z użyciem biblioteki cxl lub innej moduł rysowania z użyciem myszki linii elementów interfejsu z opisaną własnością automatycznego łączenia linii. Łączenie powinno być opcjonalne, w zależności od wyboru użytkownika. |
Program student
Program student - temat zadania 3.2 jest niekompletny. Brak w nim operacji odczytu i zapisu danych na dysk. Biblioteka cxl zawiera gotowe elementy interfejsu użytkownika do prowadzenia dialogu nt. operacji zapisu/odczytu pliku. Brakuje również opcji wprowadzania uzyskanych ocen i wyznaczania na ich podstawie średniej ocen. Do realizacji tej opcji konieczna jest lista przedmiotów do zaliczenia dla danego kierunku i roku studiów.
Uzupełnij program student o brakujące elementy. |
Panel sterowania w MS Windows
Programowanie aplikacji dla środowiska Windows jest zadaniem znacznie różniącym się od programowania aplikacji DOS-owych. Inna jest koncepcja aplikacji w środowisku, w którym może pracować wiele programów jednocześnie i wiele instancji tej samej aplikacji. Programowanie tego rodzaju aplikacji w standardowym języku C, nie posiadającym udogodnień języka obiektowego, jest żmudnym zajęciem. W tym momencie to już historia, ze względu na wygodę używania obiektów w tym zastosowaniu. Poniższe zadanie da ćwiczącemu porównanie dwóch technik programowania aplikacji dla MS Windows, po ćwiczeniu dotyczącym narzędzi środowiska Visual C++.
Przenieś aplikację student do środowiska MS Windows. |
Literatura
Borek H.: Programowanie dla Windows przy użyciu Borland C++; Lynx SFT, Warszawa 1992
Kernighan B. W., Ritchie D. M.: Język C; WNT, Warszawa 1988
Turbo Vision for C++. User's Guide; Borland International 1991
Dokumentacja biblioteki CXL w pliku cxl.doc