Den grundläggande gränssnitt till de flesta windowed program , tillåter ett grafiskt användargränssnitt ( eller GUI) för användare att arbeta med och manipulera en ansökan via ett visuellt gränssnitt med en inmatningsenhet , t.ex. en mus eller pekskärm . GUI är händelsestyrda - med andra ord , de bara agera som svar på en användares kommando . Dela upp din kod i en vy och controller hjälper dig att visualisera varje steg av GUI design . Vyer och styrenheter
Först bör du tänka på de data du vill lägga till användaren och hur de kommer att hantera det . Till exempel , i ett ordbehandlingsprogram GUI presenterar dokumentet och användaren interagerar med det genom att skriva bokstäver och välja kommandon från en meny . Du kan behöva ytterligare fönster för att redigera underavdelningar av dokumentet som bilder eller kalkylblad . Det bidrar till att skissa ett diagram separerar de olika sätt att användaren kan visa och manipulera data , inklusive en förteckning över grundläggande åtgärder användaren kan vidta .
Definiera åtgärder
Efter du har övervägt hur användarna kommer att interagera med ditt program , bör du definiera de kommandon som de kommer att använda för att utföra åtgärden . Många GUI definiera flera sätt att utföra samma åtgärd . Till exempel , för att skapa en ny fil i vissa program , har användaren möjlighet att klicka på en knapp , gå till huvudmenyn och välja den åtgärd eller använda ett kortkommando . Ett program som skapats för en enhet som en smartphone kan få ännu fler alternativ , såsom ett röstkommando eller en pekskärm åtgärd . För varje åtgärd , lista genvägen och kommandon som används för att utföra det .
Definierande händelser
Kommandon utlöses av händelser . Normalt är dessa händelser genereras från inmatningsenheter , såsom en datormus , tangentbord eller pekskärm . När användaren klickar på en musknapp , till exempel , genererar det en två händelser : a " musen ner " när knappen trycks in och ett " mus up " händelsen när knappen släpps . Kombinera dessa låg nivå händelser bildar en enda hög nivå händelse som kallas " musen nedtryckt " eller " musen klickas . " För alla dina kommandon bör du definiera tillhörande evenemang . Addera Kontroll flödesschema
När du har definierat de händelser som du kommer att använda , bör du skapa ett diagram styrflöde att modellera hela spektrumet av användarens input för ett visst kommando eller subinterface . Som GUI emot händelser , kommer det ändra tillstånd . Till exempel när en användare klickar på menyn , kommer programmet ändras från en " färdig " tillstånd till en " öppen meny " tillstånd , visar menyn för användaren . I en kontrollgrupp flödesschema , tillstånden är rutorna i diagrammet och händelserna är pilarna . Addera Integrera GUI Components
Det sista steget är att överväga vilka komponenter att använda i din GUI . En komponent är ett enda GUI-element , såsom en knapp , fönster eller rullningslisten. En layout organiserar dessa komponenter i en hierarki : till exempel , innehåller huvudfönstret en panel , som innehåller flera knappar , och så vidare . För varje hög nivå händelse du har , till exempel klicka på en knapp , måste du designa motsvarande komponent eller genomför en komponent från ett API . Detta steg är där du gör dina designbeslut som den grundläggande layouten för paneler och hela gränssnittets utseende och känsla. Återigen , använd en skiss för att visualisera den slutliga utformningen .
