1 / 30

Tworzenie Aplikacji Internetowych

Tworzenie Aplikacji Internetowych. 5. dr Wojciech M. Gańcza. Formatowanie. Informacje mogą być wyświetlane w różny sposób Możemy korzystać z różnych wielkości czcionek, kolorów, sposobów formatowania

piera
Download Presentation

Tworzenie Aplikacji Internetowych

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. Tworzenie Aplikacji Internetowych 5 dr Wojciech M. Gańcza

  2. Formatowanie • Informacje mogą być wyświetlane w różny sposób • Możemy korzystać z różnych wielkości czcionek, kolorów, sposobów formatowania • Większość tych informacji można umieścić w dokumencie HTML przy pomocy atrybutów odpowiednich znaczników • Jednak nie wszystko da się tak osiągnąć

  3. Formatowanie … • Atrybuty możemy określić w znaczniku którego formatowanie dotyczy • Musimy to robić za każdym razem (dla każdego znacznika) <p align=„right”> • Możemy też określić atrybuty stylu (uwaga: inny format) <p style=„text-align: right”> • Możemy umieścić wiele atrybutów w jednym znaczniku

  4. Formatowanie … • W razie konieczności przeformatowania dokumentu – czeka nas sporo pracy dlatego… • Możemy określać całe grupy styli i używać ich przy formatowaniu. <p class=„doprawej”> • Taką klasę stylu należy wcześniej zdefiniować • Możemy też określić jaki styl będą miały wszystkie elementy danego typu

  5. CSS2 • Do określania styli służy język CSS2 • Wartości poszczególnych atrybutów określane są poprzez konstrukcję: nazwa-atrybutu: wartość • Jeśli występuje więcej niż jeden atrybut w opisie – oddzielone są średnikiem • Wartości mogą zawierać listę elementów – separatorem jest spacja

  6. CSS2 … • Grupa atrybutów powinna być przypisana do nazwy elementu którego styl dotyczy body { margin: 0 0 0 0; background: black; text-color: #0fed945 }

  7. Klasy styli • Jeśli określimy styl dla konkretnego elementu – wszystkie elementy w dokumencie będą wyświetlane w tym stylu. • Gdy chcemy stosować dla elementów tego samego typu różne style – musimy je nazwać .doprawej { text-align: right; }

  8. Klasy styli • Nazwane klasy styli mogą dotyczyć wybranego typu elementu: p.doprawej { text-align: right; } • Możemy także określić atrybuty dla wszystkich elementów * { font-family: Helvetica; }

  9. Pseudoklasy • Jeśli element może być w różnych stanach – możemy określić styl dla każdego z nich a:link {color:yellow; background: blue} a:visited {color:green} a:hover {background:blue; color:red} a:active {background:olive; color:black} :focus {color:white; background:black} • Jeśli pseudoklasa doyczy wszyskich elementów – nie podajemy nazy elementu

  10. CSS2 – gdzie określać • Definicję stylu możemy umieścić na stronie wewnątrz znacznika <style> … </style> • Przydaje się to gdy listę styli tworzymy dynamicznie (z kodu PHP) • Możemy też włączyć plik zawierający definicje styli <LINK REL=StyleSheet HREF="style.css" TYPE="text/css" MEDIA=screen>

  11. Uwaga na błędy • W odróżnieniu od interpretera PHP czy błędów w znacznikach HTML które niektóre przeglądarki mogą pokazywać błędy w określeniu styli NIE SĄ RAPORTOWANE • Informacje o stylu są interpretowane do pierwszego błędu – potem są ignorowane • Arkusze styli należy tworzyć uważnie i często sprawdzać rezultaty zmian.

  12. Dlaczego „kaskadowe” • Atrybuty określone w elemencie są zazwyczaj dziedziczone przez podelementy – na przykład atrybuty znacznika <body> są dziedziczone przez umieszczone w nim paragrafy <p> • Nie dotyczy to wszystkich znaczników i wszystkich atrybutów – szczegóły można znaleźć w opisach atrybutów CSS2

  13. Łączenie class i style • Aby niepotrzebnie nie mnożyć definicji klas styli możemy mieszać użycie klas i bezpośrednią definicję atrybutów <tdclass="zajecia" style="background-color: #ffff80"> • Możemy w ten sposób jedynie dodawać atrybuty – nie możemy ich nadpisywać

  14. Niezgodności • Niestety style mogą być różnie obsługiwane przez różne przeglądarki • Możemy zbudować różne arkusze styli i włączać je w zależności od przeglądarki dla której przygotowujemy stronę • Dobrze użyte style powinny pozwalać na zachowanie wyglądu mimo zmiany przeglądarki

  15. Wracamy do aplikacji • Przypomnijmy: • Określiliśmy dostęp do bazy danych • Przygotowaliśmy połączenie oraz źródło danych • Zbudowaliśmy kreatora baz i tabel • Wypada stworzyć bazę danych

  16. Baza książek • Nasz aplikacja powinna pamiętać kalie podręczniki są niezbędne dla danej grupy użytkowników. • Użytkownik może być w wielu grupach • Ten sam tytuł może być potrzebny wielu grupom • Użytkownik może posiadać potrzebną książkę • Może też posiadać niepotrzebną

  17. Model danych

  18. Książki – więcej informacji

  19. A co ze sprzedawaniem… • Użytkownicy mogą oferować niepotrzebne książki • Mogą też kupować książki oferowane przez innych użytkowników • Potrzebujemy jeszcze innego spojrzenia na dane…

  20. A co ze sprzedawaniem …

  21. Trudne pytania • Niemal wszędzie będziemy potrzebowali dostęp do danych ksiązki • Budowanie zapytania które zwraca wielu autorów jest trudne (podzapytania!) • Podzapytania długo się wykonują • Postać normalna jest OK., ale… • Niektóre informacje warto zapisać w tabeli podręcznej

  22. Cache! • Dodajmy nową tabelę w której wyniki takich podzapytań będą po prostu zapamiętane

  23. Wreszcie określamy bazę • Teraz trzeba zebrać wszystkie diagramy • Relacje jeden do wielu możemy zaimplementować jako pole odnoszące się do identyfikatora w innej tabeli • Relacje wiele do wielu – to oddzielne tabele • Zauważmy, że niektóre tabele są bardzo podobne - słowniki

  24. Projekt bazy danych

  25. Znów konstruktor tabel • Nasz konstruktor tabel warto wzbogacić o • Tworzenie tabeli – słownika • Tworzenie tabeli – relacji wiele do wielu • Pola takich tabel można tworzyć automatycznie • Możemy wzbogacić klasę konstruktora tabel, albo napisać nową (dziedziczącą lub używającą konstruktora)

  26. createVocabulary function createVocabulary($name) { $this->startTable($name); $this->addField($name . "Name", "name"); $this->createTable(); }

  27. createMultireference function createMultireference( $name1, $name2) { $this->startTable($name1 . $name2); $this->addReference($name1 . "ID", $name1); $this->addReference($name2 . "ID", $name2); $this->addUnique($name1 . $name2 . "unique", "${name1}ID,${name2}ID"); $this->createTable(); }

  28. Constraint • A jeśli potrzebujemy zapwnić unikalność danych: function addUnique($name, $fildList) { $this->contraints .= ", CONSTRAINT $name UNIQUE ($fildList)"; }

  29. Constraints… • Musimy także zmodyfikować konstruktor tabel tak by • Zawierał pole przechowujące aktualna listę constraintów • Dodawał tą listę podczas zamykania tabeli

  30. W następnym odcinku • Dostęp do danych • Konstruujemy dane testowe • Wyświetlamy dane z tabel • A wszystko to dla różnych użytkowników • Ale tylko listy potrzebnych książek 

More Related