Rysowanie GUI Określanie wyglądu komponentów

Slides:



Advertisements
Podobne prezentacje
I część 1.
Advertisements

Rysowanie w Java void drawString(String tekst, pozX, pozY)
Znaki informacyjne.
Programowanie wizualne
Programowanie obiektowe
Programowanie obiektowe
Liczby pierwsze.
Tworzenie i obsługa programów – przykład 3 uwagi cd. Wykorzystując różne klasy biblioteki języka Java należy pamiętać w jakim pakiecie się znajdują. Wszystkie.
Kolory, grafika, multimedia
Style CSS.
Grafika komputerowa Wykład 2 Wykorzystanie podstawowych usług bibliotecznych (API) w operacjach graficznych.
Java applet (c.d.) Nguyen Hung Son Uniwersytet Warszawski.
Projektowanie interfejsu Pakiet AWT, komponenty i kontenery, klasa Component, metody klasy Component, klasa Label, komponenty tekstowe, klasa TextField,
Programowanie wielowątkowe
Multimedia Obrazy i dźwięki w apletach Javy, praca z tekstem, zdarzenia od myszki, obsługa wyjątków w Javie, aplety z wątkami, animacja poklatkowa.
Programowanie sieciowe w Javie
1 Podstawy apletów Co to jest aplet, cykl życia apletu, metody apletu, metoda paint(), czcionki, kolory, parametryzowanie apletu, układ współrzędnych ekranowych,
Plan Prezentacji Wczytywanie grafiki Wyświetlanie obrazów
1 Języki i techniki programowania prowadzący dr Grzegorz Filipczyk.
Klasyfikacja systemów
Edytor Graficzny Paint
Pytania konkursowe.
przygotował Michał Wdaniec
Tworzenie stron internetowych www World Wide Web
Wykonawcy:Magdalena Bęczkowska Łukasz Maliszewski Piotr Kwiatek Piotr Litwiniuk Paweł Głębocki.
Pakiety w Javie Łukasz Smyczyński (132834). Czym są pakiety? Klasy w Javie są grupowane w pewne zbiory zwane pakietami. Pakiety są więc pewnym podzbiorem.
Projektowanie Stron WWW
języka hipertekstowego
Czym jest JavaFX? Rich Internet Application
Tadeusz Ziębakowski Zachodniopomorski Uniwersytet Technologiczny.
Aplety w javie.
Opracowanie: mgr Barbara Benisz
Programowanie obiektowe
Opracowanie Dorota Libera
Programowanie obiektowe
KOLEKTOR ZASOBNIK 2 ZASOBNIK 1 POMPA P2 POMPA P1 30°C Zasada działanie instalacji solarnej.
Programowanie obiektowe – zastosowanie języka Java SE
Seminarium problemowe
Co jeszcze mógłby wymyślić Einstein gdyby znał applety Javy? Dolnośląski Festiwal Nauki i Techniki Wrocław 2005.
Tworzenie komiksu MS PowerPoint Beata Sanakiewicz.
EDYTOR GRAFIKI "PAINT" Prezentacja ma na celu zapoznanie uczniów z podstawowymi funkcjami edytora grafiki Paint.
Temat 5: Pozycjonowanie elementów
Zaawansowane komponenty graficzne Swing
HTML Hyper Text Markup Language
EcoCondens Kompakt BBK 7-22 E.
HTML.
Dofinansowano ze środków Ministra Kultury i Dziedzictwa Narodowego
User experience studio Użyteczna biblioteka Teraźniejszość i przyszłość informacji naukowej.
Aplikacje internetowe
Elementy multimedialne na stronie
Aplikacje internetowe
Testogranie TESTOGRANIE Bogdana Berezy.
EDYTOR GRAFIKI PAINT - podstawy pracy.
MS Office MS PowerPoint 2007
EDYTOR GRAFIKI PAINT - podstawy pracy.
Podstawowe narzędzia programu Paint
Temat 9: Obrazy i multimedia
Elementy geometryczne i relacje
XHTML Tworzenie stylów CSS Damian Urbańczyk. Zewnętrzny plik CSS Aby ułatwić sobie pracę ze stylami, najlepiej utworzyć osobny plik, w którym będą przechowywane.
Strategia pomiaru.
Damian Urbańczyk xHTML Elementy graficzne.
Wykład 4 Informatyka MPDI sem.3 HTML cd. Arkusze stylów - CSS.
Edytor tekstu Word – możliwości graficzne
Akademia ETI 2016 LABORATORIUM 2 – OBSŁUGA WYŚWIETLACZA GRAFICZNEGO.
LaTeX cd.
Java-wykład Grafika.
Arkusz stylów CSS Cascading Style Sheet.
Programowanie obiektowe – zastosowanie języka Java SE
Zapis prezentacji:

Rysowanie GUI Określanie wyglądu komponentów Język Java Rysowanie GUI Określanie wyglądu komponentów

Rysowanie GUI Rysowanie GUI w Swingu np. przy pierwszym wyświetleniu przy ponownym odsłonięciu przy zmianach stanu programu Kolejność rysowania - zgodnie z hierarchią komponentów Każdy komponent rysuje się sam

Kolejność rysowania GUI Przykład - aplikacja AplikSwing JFrame - rysuje ramkę panel z zawartością (content pane) - rysuje tło (szary prostokąt) JLabel - rysuje tekst etykiety JButton - rysuje przycisk i ewentualny napis

Własności komponentu Komponent może być Na komponencie można rysować przezroczysty nieprzezroczysty (opaque) - z tłem Na komponencie można rysować Ustawianie kolorów wyglądu czcionki komponentu obramowania

Kolejność rysowania komponentu

Przerysowywanie komponentu Przerysowanie komponentu - automatyczne Wymuszenie przerysowania - metoda repaint() W przypadku zmiany rozmiaru lub pozycji komponentu - wywołanie metody revalidate() przed repaint()

Grafika Podstawowe operacje graficzne np. rysowanie linii rysowanie figur rysowanie znaków tekstu wstawianie obrazów Operacje - zdefiniowane jako metody klasy java.awt.Graphics Obiekt klasy Graphics przechowuje aktualne ustawienia stanu graficznego

Grafika: rysowanie Rysowanie - na dowolnym komponencie Najczęściej - rysowanie na panelu (JPanel) Wszystkie polecenia rysowania - w metodzie paintComponent() klasy JComponent (konieczność przesłonięcia) Argument metody - obiekt klasy Graphics

Układ współrzędnych komponentu x (0,0) (szer-1, wys-1) y jednostka układu współrzędnych - piksel

Ustalanie wymiarów komponentu Określanie wymiarów komponentu (metody klasy JComponent) int getWidth() int getHeight() Rysowanie obramowania - zmniejszenie wymiaru komponentu Określenie rozmiaru obramowania - metoda getInsets(), np. Insets b = getInsets(); s = getWidth() - b.left - b.right; w = getHeight() - b.top - b.bottom;

Grafika: dostępne kształty Linia (Line) Figury prostokąt (Rect) prostokąt z efektem 3D (3DRect) prostokąty o zaokrąglonych brzegach (RoundRect) owal - okrąg lub elipsa (Oval) łuk (Arc) Wieloboki (Polygon, Polyline)

Grafika: rysowanie kształtów Rysowanie linii void drawLine(x1, y1, x2, y2) Rysowanie figur tylko brzegi - metoda drawXxx() brzegi i wypełnienie - metoda fillXxx () Przykład - rysowanie prostokąta void fillRect(xlg, ylg, szer, wys) void drawRect(xlg, ylg, szer-1, wys-1) Wymiary - liczby całkowite (int)

Grafika: rysowanie kształtów Wieloboki - argument w postaci grupy par współrzędnych x i y wierzchołków Owale - argumenty współrzędne x i y lewego górnego rogu obszaru, w który zostanie wpisany owal szerokość i wysokość owalu Łuki - argumenty jak dla owalu oraz kąt, od jakiego zacznie się rysowanie łuku kąt określający rozpiętość łuku

Aplet Rysunek import javax.swing.*; import java.awt.*; public class Rysunek extends JApplet { public void init() { panelRys mojPanel = new panelRys(); getContentPane().add(mojPanel, BorderLayout.CENTER); }

class panelRys extends JPanel { public void paintComponent(Graphics g) { super.paintComponent(g); // tło Insets w = getInsets(); int X = getWidth() - w.left - w.right; int Y = getHeight() - w.top - w.bottom; int x1 = X/4; int y1 = Y/4; int szer = X/2; int wys = Y/2; g.drawRect(x1, y1, szer, wys); g.fillRect(szer, y1, x1, y1); int x2 = x1/2; int y2 = y1/2; g.drawLine(x1+x2, y2, x1+x2, y1+wys+y2) }

Obrazy Obrazy (formaty GIF i JPEG) - przechowywane jako odrębne pliki Obraz - obiekt klasy java.awt.Image Metody klasy Image zwracające wymiary obrazu - getWidth() i getHeight() Umieszczanie obrazu na komponencie kopiowanie do komponentu wyświetlanie

Obrazy: kopiowanie (aplikacje) Metoda getImage() klasy java.awt.Toolkit Image getImage(URL url) Image getImage(String plik) Przykład Toolkit tk; Image rys1, rys2; tk = Toolkit.getDefaultToolkit(); rys1 = tk.getImage("obrazek.gif"); rys2 = tk.getImage(new URL(http://www.new.pl/rys/p1.gif));

Obrazy: kopiowanie (aplety) Metoda getImage() klasy Applet Image getImage(URL url) Image getImage(URL url, String plik) Metody klasy Applet zwracające obiekty klasy URL getCodeBase() - adres URL katalogu z apletem getDocumentBase() - adres URL katalogu z dokumentem HTML Przykład Image rys = getImage(getDocumentBase,"plik.gif");

Obrazy: wyświetlanie Wyświetlanie - metoda drawImage() klasy Graphics Sposoby wyświetlania obraz w jego oryginalnych wymiarach void drawImage(obraz, x, y, this); obraz przeskalowany void drawImage(obraz, x, y, szer, wys, this); Argumenty metody x, y - współrzędne lewego górnego rogu obrazu

Aplet Obraz import javax.swing.*; import java.awt.*; public class Obraz extends JApplet { public void init() { Image obraz=getImage(getCodeBase(), "fotki/foto.jpg"); panelObraz mojPanel = new panelObraz(obraz); getContentPane().add(mojPanel, BorderLayout.CENTER); }

class panelObraz extends JPanel { Image obraz; public panelObraz(Image obraz) { this.obraz = obraz; } public void paintComponent(Graphics g) { super.paintComponent(g); int a = obraz.getWidth(this); int b = obraz.getHeight(this); g.drawImage(obraz, 0, 0, this); g.drawImage(obraz, a, 0, a+10, b/2, this);

Widok apletu Obraz

Tekst Klasy z pakietu java.awt odpowiedzialne za wygląd tekstu Font - określa rodzaj, styl i wielkość czcionki FontMetrics - określa szczegółowo parametry czcionki - tzw. metrykę (np. wysokość i szerokość liter) Rysowanie tekstu na komponencie komponenty Swingu metoda drawString() klasy Graphics

Tekst: wybór rodzaju czcionki Argumenty konstruktora klasy Font nazwa czcionki, np. "TimesRoman" ("serif"), "Courier" ("monospaced"), "Helvetica" ("sanserif") styl czcionki, np. Font.PLAIN, Font.BOLD, Font.ITALIC (można dodawać) wielkość czcionki Jeśli użyta czcionka nie jest dostępna, Java użyje czcionki domyślnej Ustawienie czcionki aktualnej - setFont()

Tekst: rysowanie, klasa Graphics Rysowanie tekstu o parametrach określonych aktualną czcionką void drawString("tekst", x, y) Przykład Font f = new Font("TimesRoman", Font.PLAIN, 30); g.setFont(f); s = "Java"; g.drawString(s, 50, 50);

Tekst: wymiary czcionki Xy Ascent Height Descent a Leading

Tekst: metryka czcionki Metody klasy FontMetrics stringWidth(String) - zwraca szerokość łańcucha znaków (w pikselach) charWidth(char) - zwraca szerokość znaku getAscent() getDescent() getLeading() getHeight()

Kolory Kolory i metody operujące na kolorach - definicje w klasie java.awt.Color Abstrakcyjne wzorzec koloru - kombinacja wartości kolorów podstawowych (RGB) - liczb z zakresu 0 ÷ 255, np. Color k = new Color(100, 50, 150); Kolor niedostępny w systemie - zastępowany podobnym

Kolory: nazwy i wartości RGB Color.black 0, 0, 0 Color.white 255, 255, 255 Color.red 255, 0, 0 Color.green 0, 255, 0 Color.blue 0, 0, 255 Color.gray 128, 128, 128 Color.lightGgray 192, 192, 192 Color.darkGray 64, 64, 64 Color.magenta 255, 0, 255 Color.yellow 255, 255, 0 Color.cyan 0, 255, 255 Color.pink 255, 175, 175 Color.orange 255, 200, 0

Określanie wyglądu komponentu Metoda klasy JComponent ustawiająca przezroczystość komponentu - setOpaque(boolean), np. przeroczysty: komponent.setOpaque(false); Kontrola przezroczystości - getOpaque() Metoda klasy JComponent ustawiająca czcionkę komponentu - setFont(Font) Informacje o czcionce - getFont(), getFontMetrics()

Określanie wyglądu komponentu Metody klasy JComponent ustawiające kolor setBackground(Color) - tła setForeground(Color) - pierwszego planu Analogiczne metody zwracające ustawienia getBackground(), getForeground() Ustawianie koloru, np. komponent.setBackground(Color.red); Ustawianie własnego koloru, np. Color c = new Color(150, 10, 150); komponent.setForeground(c);

Aplet Kolory import javax.swing.*; import java.awt.*; public class Kolory extends JApplet { public void init() { Font c = new Font("sanserif", Font.ITALIC, 40); JLabel napis = new JLabel("Java", JLabel.CENTER); Container kont = getContentPane(); kont.add(napis); napis.setOpaque(true); napis.setBackground(Color.yellow); napis.setForeground(Color.blue); napis.setFont(c); }

Widok apletu Kolory

Określanie wyglądu komponentu Metody klasy JComponent określające wymiary elementu int getWidth() int getHeight() Dimension getSize() Dimension getPreferredSize() Dimension getMaximumSize() Dimension getMinimumSize() Inne metody np. void setPreferredSize(Dimension)

Obramowanie komponentu Dodawanie obramowania - metoda setBorder() klasy JComponent Typy obramowania (klasa javax.swing.BorderFactory) Line, Etched, LoweredBevel, RaisedBevel, Empty, Matte, Titled, Compound Tworzenie obramowania - createXxxBorder() Przykład b=BorderFactory.createLineBorder(Color.black); komponent.setBorder(b);

Obramowania: rodzaje

Obramowania: rodzaje

Obramowania: rodzaje

Obramowania: rodzaje

Aplet Kropki import java.awt.event.*; import javax.swing.*; public class Kropki extends JApplet { JLabel tekst = new JLabel("Kliknij w dowolnym miejscu białego obszaru!", JLabel.LEFT); myszPanel panel = new myszPanel();

public void init() { Container kont = getContentPane(); tekst.setOpaque(true); tekst.setBackground(Color.yellow); panel.setOpaque(true); panel.setBackground(Color.white); panel.setForeground(Color.blue); panel.setBorder( BorderFactory.createEtchedBorder()); kont.add(panel, BorderLayout.CENTER); kont.add(tekst, BorderLayout.SOUTH); }

class myszPanel extends JPanel { Point p; public myszPanel() { addMouseListener(new MouseAdapter() { public void mousePressed(MouseEvent zd) { int x = zd.getX(); int y = zd.getY(); if (p == null) p = new Point(x, y); else { p.x = x; p.y = y; } repaint(); } });

public void paintComponent(Graphics g) { super.paintComponent(g); if (p != null) g.fillOval(p.x-10, p.y-10, 20, 20); }

Java 2D Java 2D - zbiór dodatkowych klas dostarczających programom wysokiej jakości grafiki dwuwymiarowej Java2D umożliwia m.in. ustalenie rodzaju wypełnienia (np. gradienty) ustalenie szerokości i rodzaju linii przesuwanie, obracanie, skalowanie tekstu i grafiki Współrzędne w Java2D – typu float

Java 2D: Klasa Graphics2D Operacje rysowania grafiki - klasa Graphics Java2D używa obiektu klasy Graphics2D (pakiet java.awt) konieczność rzutowania Przykład – metoda paintComponent() public void paintComponent(Graphics g) { Graphics2D g2D=(Graphics2D)g; // treść metody }

Java 2D: metody grafiki 2D Wykonywanie wszystkich operacji grafiki 2D - na obiektach klasy Graphics2D, nawet jeśli metody 2D i nie-2D sa takie same Przykład – definiowanie kolorów g2D.setColor(Color.black); Dodatkowe klasy grafiki 2D - w pakiecie java.awt.geom - np. Line2D, Line2D.Float, Point2D, Rectangle2D, Rectangle2D.Float

Java 2D: rodzaje wypełnienia Wypełnianie w Java2D – metoda setPaint() Rodzaje wypełnień kolorem gradientami teksturą własnym wzorem Interfejs Paint zawiera klasy GradientPaint, TexturePaint i Color

Java 2D: wypełnianie gradientami Konstruktory klasy GradientPaint GradientPaint(x1, y1, kolor1, x2, y2, kolor2) GradientPaint(x1, y1, kolor1, x2, y2, kolor2, true) Rysowanie gradientu początek w punkcie x1,y1 - kolor kolor1 koniec w punkcie x2,y2 - kolor kolor2 true określa, czy gradient ma być rysowany cyklicznie

Aplet Gradient import javax.swing.*; import java.awt.*; import java.awt.geom.*; public class Gradient extends JApplet { public void init() { panelRys mojPanel = new panelRys(); getContentPane().add(mojPanel, BorderLayout.CENTER); }

class panelRys extends JPanel { public void paintComponent(Graphics g){ super.paintComponent(g); Dimension d = getSize(); int s = d.width; int w = d.height; Graphics2D g2D = (Graphics2D)g; GradientPaint wzor = new GradientPaint(0, 0, Color.white, s, w,Color.blue); g2D.setPaint(wzor); Rectangle2D.Float pr = new Rectangle2D.Float(0, 0, s, w); g2D.fill(pr); }

Widok apletu Gradient

Java 3D Java 3D - zbiór klas umożliwiających tworzenie rzeczywistości wirtualnej, rozszerzenie pakietu JDK Najważniejsze klasy Javy 3D - w pakietach javax.media.j3d i javax.vecmath