CentrumXP.pl » Witamy
CentrumXP.pl
 
Szukaj
Subskrypcja
Powiadomienie e-mailem o nowościach na CentrumXP.pl:
E-mail: Zapisz
Czy zamierzasz pobrać Internet Explorer 9?


CentrumXP.pl » Microsoft .NET » Visual C# w praktyce » Dodaj do ulubionych Dodaj do ulubionych   Dodaj do ulubionych Wersja do wydruku

Analogowy zegarek

Autor: Maciej Zelwak    Opublikowano: 7 grudnia 2007    Odsłon: 94024    »Skomentuj...
Strona:
Zobacz również:

Budzik w C#

Commander w C#

Kalkulator w C#

Komunikator w C#

Mini Paint w C#

Notatnik w C#

Przeglądarka internetowa w C#

Przeglądarka zdjęć w C#

Przetwarzanie obrazów

Snake w C#

Tetris w C#

Wygaszacz ekranu w C#

»Uzyskaj pomoc na forum

W artykule zajmiemy się programowaniem analogowego zegarka. Przy okazji ćwicząc posługiwanie się biblioteką GDI +, która to oferuje dostęp do szeregu metod graficznych. Począwszy od tych najprostszych, jak rysowanie figur oraz ich wypełnianie, skończywszy na bardziej zaawansowanych własnościach, takich jak anti-aliasing czy też alpha blending. Oczywiście będziemy korzystać tylko z niewielkiej ich części, co jednak nie będzie przeszkodą, w uzyskaniu efektu podobnego do jednego z gadżetów systemu Windows Vista.

Niezbędna matematyka

Zanim zajmiemy się aspektem programistycznym, musimy sobie przypomnieć pewne podstawy matematyczne. Wiadomo, że okrąg ma 360°, czyli 2? lub 1 radian. Dzieląc tą wielkość, przez ilość godzin na tarczy zegara, otrzymamy odległość jaka powinna dzielić kolejne etykietki godzin, czyli 30°. W podobny sposób wyznaczymy kąt dla poszczególnych wskazówek.

sekundyTic = 2.0 * Math.PI * sekundy / 60.0;

Wyrażenie sekundy/60 możemy potraktować jako wartość procentową obrotu wskazówki. Dla przykładu kiedy liczba sekund wynosi 30, czyli wskazówka znajduje się nad szóstką, wartość ta jest równa 50%. Ponieważ wartości kątów muszą być wyrażone w radianach, procent obrotu jest mnożony przez 2?. Znając wartość kąta oraz promień, możemy obliczyć współrzędne punktu określającego koniec wskazówki bądź położenie etykietki. Używamy do tego celu funkcji trygonometrycznych, cosinus do wyznaczenia współrzędnej x, sinus do wyznaczenia współrzędnej y.

Piszemy aplikację

Pora zabrać się za implementację. Tworzymy nowy projekt typu Window Application i wprowadzamy nazwę, czyli AnalogClock. Zmieniamy nazwę pliku z formą na MainForm.cs. Tarczę zegara będziemy rysować w środku okna, więc ustawimy jego rozmiar (Size) na 170x170. Przechodzimy do widoku kodu i sprawdzamy czy używamy niezbędnych przestrzeni nazw.

using System.Drawing.Drawing2D;
using System.Drawing.Text;
using System.Drawing;

Na początku klasy dodamy zmienne globalne wykorzystywane w programie.

private Rectangle rect;
private LinearGradientBrush obramowanieKolor;
private SolidBrush tarczaKolor;
private SolidBrush liczbyKolor;
private SolidBrush podpisKolor;
private Pen cienTarczyKolor;
private Pen pioro;
private Pen pioroSek;
private int srednica;
Następnie utworzymy pierwszą metodę, którą nazwiemy inicjujNarzedzia(), a jej wywołanie dopiszemy do konstruktora. Zainicjujemy w niej wszystkie obiekty graficzne, których będziemy używać. GDI+ umożliwia rysowanie każdym obiekcie graficznym, może to być  PictureBox, Panel, lub po prostu mapa bitowa. W tworzonym właśnie programie będzie to obszar roboczy formy. Zmienna ClientSize zawiera jego wymiar. Użyjemy jej do stworzenia obiektu typu Rectangle, czyli prostokąta, o wymiarach zegarka.  srednica = 120;
rect = new Rectangle(this.ClientSize.Width / 2 - srednica / 2, this.ClientSize.Height / 2 - srednica / 2, srednica,srednica);

Następnie zaalokujemy resztę potrzebnych zasobów. Jednym z nich jest pióro (pen), za pomocą którego możemy kreślić po ekranie. Posiada ono wiele właściwości, najważniejszymi dla nas są: kolor (Color), szerokość linii (Width), styl (DashStyle) oraz rodzaj początku i końca linii (StartCap i EndCap). Do określenia niestandardowych barw używamy metody FromArgb klasy Color. Parametrami tej funkcji są trzy liczby całkowite z zakresu 0..255, określające intensywność czerwieni, zieleni oraz błękitu w tworzonym kolorze. Obiekty Brush, czyli inaczej mówiąc pędzle, pozwalają określić rodzaj wypełnienia. 


1 2 3 4 Dalej» 

Aktualna ocena to: 3,63

Oceń artykuł...
Porażka Kiepski Taki Sobie Dobry Super!

Tagi:  

A teraz:    Dodaj do ulubionych Dodaj do ulubionych    Wydrukuj Wydrukuj    Wyślij link znajomemu Wyślij link znajomemu    Skomentuj Skomentuj

Komentarze do Analogowy zegarek

Dodaj komentarz»

compaq11 7 grudnia 2007, 17:55

świetny artykuł żadnych błędów, dużo nowych funkcji

ShaViNoj 7 grudnia 2007, 22:51

Super

Programista C# 7 grudnia 2007, 22:54

Bardzo ciekawy artykuł. Zero błędów :-). W sam raz dla początkujących. ;-) Pozdrawiam, - - - John Krauch :">

shay 8 grudnia 2007, 10:00

U mnie po dodaniu graphics.SmoothingMode = SmoothingMode.AntiAlias; graphics.TextRenderingHint = TextRenderingHint.AntiAlias; graphics.InterpolationMode = InterpolationMode.HighQualityBicubic; Zegar wygląda jak bez anti-aliasingu. Kto wie jak to naprawić? I jeszcze jedno pytanie. Jak można usunąć tę aplikację z "ALT + TAB", tzn. żeby po naciśnięciu tych klawiszy nie było można wybrać tego zegarka?

Llukkass 9 grudnia 2007, 11:32

Witam fajny artykuł tylko szkoda że redakcja centrumxp nie dodała całego gotowego projektu do pobrania czasem bardzo to pomaga mogąc analizować kod jeśli jest taka możliwość serdecznie proszę o publikację całego projektu pozdrawiam Łukasz

Grzesiek 15 grudnia 2007, 18:42

No właśnie ja też bym bardzo prosił o cały projekt. Jestem początkujący w C# i jest to dla mnie chyba trochę za duży przeskok pomiędzy poprzednimi dwoma kursami, a tym. Z góry dziękuję i pozdrawiam.

moriturius 19 grudnia 2007, 19:07

mam kilka uwag odnośnie artykułu: 0) nie ma nigdzie co zrobić aby znikła belka tytułowa aplikacji 1) niektóre obliczenia są "na około" 2) większość obliczeń można zrobić znacznie szybciej 3) cały zegarek można stworzyć używając połowy tych zmiennych których użyłeś tutaj. Jako przykład do punktu trzeciego dam choćby to przesuwanie formy. Można to samo zrealizować posiadając 2 zmienne: private Point mouseOldPos; private bool mouseDown; wtedy kod w MouseDown() powinien byc taki: mouseDown = true; mouseOldPos = Control.MousePosition; W MouseUp() oczywiscie wystarczy tylko: mouseDown = false; Natomiast kod w MouseMove() mam taki: if (mouseDown) { Point p = new Point( Location.X + Control.MousePosition.X - mouseOldPos.X, Location.Y + Control.MousePosition.Y - mouseOldPos.Y); Location = p; mouseOldPos = Control.MousePosition; } Jest to 100 razy krotsze i 10000 razy bardziej zrozumiale. Nie rozumiem także po co tworzyć po 2 punkty dla każdej wskazówki - jeden na cień a drugi dla samej wskazówki. Lepiej najpierw narysować wskazówkę, a potem zmniejszyc obie wspolrzedne punktu o 2 i narysowac wskazowke zamiast obliczac znowu funkcje trygonometryczne ktore sa strasznie wolne :| Podsumowujac: Artykul bylby fajny gdyby nie beztroskie podejscie do szybkosci dzialania i ilosci dostepnej pamieci.

bubek 20 stycznia 2008, 13:10

ma ktoś zrobiony cały kod?? i mógłby go podesłac na maila?? albo gdzies umieścic?

Sielu 20 stycznia 2008, 21:47

no właśnie, ma ktoś to może sklecone, działające ?... bo jakoś nie moge dojść do ładu..,jestem bardzo początkujący i zapewne popełniam jakieś oczywiste błędy..

Sielu 20 stycznia 2008, 23:43

a już rozgryzłem :) już wsio śmiga :D

Aleksander 25 lutego 2008, 9:21

Mozna prosic o zrodlo calosci?agencja618@wp.pl

kwaq 6 marca 2008, 0:24

Zmieszałem dwa tutki: "Analogowy zegarek" i "budzik". Nie miałem zbyt wiele czasu na poprawienie błędów, więc mogą się jakieś trafić. Link do projektu: http://www.chomikuj.pl/qic/Programowanie/c*23/Alarm+Clock.7z

m 31 marca 2008, 11:49

graphics.FillEllipse(obramowanieKolor, srWidth - srednica / 2 - ramka/2, srHeight - srednica / 2 - ramka/2, srednica + ramka, srednica + ramka); graphics.FillEllipse(tarczaKolor, rect); graphics.DrawEllipse(cienTarczyKolor, rect); Po tych poleceniach powinny pojawic sie okregi a moje okno z MainForm wciaz jest cale szare - nic sie nie zmienilo. 0 errors, 0 warnings. Co jest nie tak?

michalek 17 maja 2008, 14:15

przepraszam moze to glupie pytanie?? ale w czym jest pisany ten zegarek (w jakim programie?)

DeyV 19 maja 2008, 19:22

Kurs, jak sama nazwa działu wskazuje, dotyczy C# A najlepszym sposobem na pisanie w C# jest skorzystanie z visual studio C# , np. wersji Express...

Zubr 21 czerwca 2008, 15:14

Niech ci Bóg w dzieciach wynagrodzi. Bardzo ciekawy tutorial.

Kasiek 16 lipca 2008, 16:38

Super artykul:) Bardzo mi sie podoba i dobrze wprowadza do korzystania z System.Drawing ;)

Coltain 10 września 2008, 19:09

Swietne, pokazuje czytelnie co i jak

canim 16 października 2008, 16:54

A jak dla mnie powinien byc dodany kod na samym koncu calosci bo jak ktps jest naprawde poczatkujacy to sie gubi w tym:/

staszic 26 października 2008, 12:23

Gdy ustawiam wartość timer.Interval = 100, zegar odswierza się dalej co 1 sekundę, czego może być to wina? wartość ustawiam w zakładce formy

Początujacy 1 listopada 2008, 14:03

Naprawde staralem sie zrozumiec ten kurs moze jak ktos pisal juz cos takiego to wie, niestety nie wszyscy wiedza. Po komenatrzach widze ze mimo prośby uzytkowników owe forum nie postaralo sie umiescic w calości kodu. Wiec stwierdzam ze te artykuly sa nieczytelne dla wielu i sie nie nadaja.
 

krz.rusz 20 grudnia 2008, 23:53

Odnośnie tej wypowiedzi:
"graphics.FillEllipse(obramowanieKolor, srWidth - srednica / 2 - ramka/2, srHeight - srednica / 2 - ramka/2, srednica + ramka, srednica + ramka); graphics.FillEllipse(tarczaKolor, rect); graphics.DrawEllipse(cienTarczyKolor, rect); Po tych poleceniach powinny pojawic sie okregi a moje okno z MainForm wciaz jest cale szare - nic sie nie zmienilo. 0 errors, 0 warnings. Co jest nie tak?"
U mnie to też występuje, doszegłem do tego, że nie wywołuje się zdażenie "Print".
ale jak to naprawić to nie mam pojęcia.

freemp3 9 lutego 2009, 16:15

Mam dokładnie ten sam problem co poprzednik. Nie moge wywołać zdażenia print i pojawia się puste okno. Jeśli chodzi o kod to został on przepisany w całości. Nie wklejony, tylko przepisany.

yhy 26 lutego 2009, 20:03

ja też mam ten problem co koledzy wyżej... wie ktoś jak sobie z tym poradzić?

djmati11 14 kwietnia 2009, 19:21

Super artykuł. Dzięki niemu napisałem zegarek w VB. Przetłumaczyłem sam z C# na VB

?? 23 lipca 2009, 15:45

Jaki jest wzorek na sekundaTic ??

Latoo 27 lipca 2009, 13:29

sekundyTic = 2.0 * Math.PI * (sekundy) / 60.0; promien = 53;

MateuszG. 14 listopada 2009, 16:13

Zegarek bardzo fajny, duzo nowych funkcji, ale jest jeden błąd ponieważ sekundyTic nie sa nigdzie wyliczone i pogram widzi bład. Nalezy to poprawidz wtedy program działa bez zarzutów.

hip9k 8 grudnia 2009, 22:01

moze ktos wrzucic gotowy projekt w visualu ??? bo niechce mi sie przepisywac a pare rzeczy by mi sie moglo przydac

LuckyF 14 lutego 2010, 11:38

Świetny poradnik dla początkujących w C#, zero błędów, trzeba się troche zastanowić i wszystko ładnie składa się w całość. Pozdrawiam!

lu 19 lutego 2010, 17:29

http://www.speedyshare.com/files/21020552/AnalogClock.rar Czy ktos wie jak włączyć antyaliasing dla przeźroczystości? Na białym tle działa ale przy przeźroczystości krawędzie są poszarpane

b4art 27 marca 2010, 14:23

Tym, którym to nie działa niech zastosują:   [color=#0000ff; font-size: x-small">[color=#0000ff"><font size="2" color="#0000ff">public [/color">[color=#0000ff">  [/color">
[size= x-small"> MainForm(){ inicjujNarzedzia(); <font size="2">    [color=#0000ff; font-size: x-small">this[/color">
[size= x-small">.Paint += [/size">[color=#0000ff; font-size: x-small">new[/color">
[size= x-small"> [/size">[color=#2b91af; font-size: x-small">PaintEventHandler[/color">
[size= x-small">(MainForm_Paint);} [/size">

b4art 27 marca 2010, 14:26

Tym ,którym nie działa funkcja Paint i nic się nie chce rysować niech zastosują: public MainForm() { this.Paint += new PainEventHandler(MainForm_Paint); }

brat 19 kwietnia 2010, 10:38

Czy ktoś może wysłać cały kod? Bratan4ik@gmail.com

dizi 30 kwietnia 2010, 19:52

Dzieki b4art za podpowiedz, lata by minely zanim bym na to wpadl

dizi 1 maja 2010, 1:07

Znalazlem to o czym nie wspomnial autor artykulu, czyli "co zrobic zeby sie narysowalo". Klikamy na forme->Properties->Events -> tam znajdujemy zdazenie "Paint" i wrzucamy tam wczesniej zdefiniowana metode do rysowania Moze sie to komus jeszcze przyda, dzieki za te artykuly - nieoceniona pomoc

kk 4 czerwca 2010, 13:20

coś nie tak mam z metodą inicjujNarzedzia() bo zwraca mi nulle, przez co graphics.FillEllipse(...) wywala się błędem value cannot be null proszę o pomoc - co mam nie tak? tak zapisałem mteodę: public void inicjujNarzedzia() { srednica = 120; rect = new Rectangle(this.ClientSize.Width / 2 - srednica / 2, this.ClientSize.Height / 2 - srednica / 2, srednica, srednica); obramowanieKolor = new LinearGradientBrush(rect, Color.FromArgb(0, 0, 0), Color.FromArgb(60, 60, 60), 60); tarczaKolor = new SolidBrush(Color.WhiteSmoke); liczbyKolor = new SolidBrush(Color.FromArgb(10, 10, 10)); podpisKolor = new SolidBrush(Color.Blue); cienTarczyKolor = new Pen(Color.FromArgb(180, 180, 180), 3); pioro = new Pen(Color.FromArgb(10, 10, 10), 4); pioroSek = new Pen(Color.Red, 2); pioro.EndCap = LineCap.ArrowAnchor; pioro.StartCap = LineCap.RoundAnchor; pioroSek.EndCap = LineCap.ArrowAnchor; pioroSek.StartCap = LineCap.RoundAnchor; cienTarczyKolor.EndCap = LineCap.ArrowAnchor; cienTarczyKolor.StartCap = LineCap.RoundAnchor; }

wole JAVA i netBeans 18 listopada 2010, 10:57

To rzuc ktos rozwiazanie, bo wywala blad przy rysowaniu, najlepiej na rapidzie.

wole JAVE i netBeans 18 listopada 2010, 12:33

Problem rozwiazany z rysuj(), najpierw trzeba wpisac w MainForm(){ inicjujNarzedzia(); this.Paint += new PaintEventHandler(MainForm_Paint); //pB.Paint += new System.Windows.Forms.PaintEventHandler(this.pB_Paint); }   nastepnie wybrac: private void MainForm_Paint(object sender, PaintEventArgs e) { //rysuj(e.Graphics); }   private void paintBox1_Paint(object sender, PaintEventArgs e) { rysuj(e.Graphics); } mam nadzieje ze sie przyda taka mala podpowiedz poczatkujacym. I tak JAVA lepsza, w netBeans-ie taki problem to 15min a nie cala noc w .net-cie. :-)

anonim 23 listopada 2010, 20:33

Czy ktoś posiada działający kod? Dla początkującego artykuł bez całego kodu, jest bezużyteczny.

gural 28 listopada 2010, 19:47

Może ktoś przesłać cały kod?? gural1004@wp.pl

miho 2 grudnia 2010, 12:39

Ludziska macie ten kod bo jestem po kursiku a ten zegar to troche za wysoka poprzeczka poki co.Dajcie jakis link do tego kodu.

Marek 9 grudnia 2010, 13:49

wszystko ok do momentu w ktorym wskazowki powinny sie przesuwac. przy kompilacji nie ma zadnego bledu, kontrolka Timer jest opisana jak w przykladzie. ma ktos pomysl jak to rozwiazac?

Sylwek 5 czerwca 2011, 15:33

Bardzo proszę kogoś o umieszczenie gdzieś całego kodu.

Robert 14 czerwca 2011, 13:31

Witam ma ktoś może cały kod do tej aplikacji? gdyż jestem początkujący w tej sprawie i bardzo by mi się przydał. Jeśli ktoś ma to bardzo bym prosił o podesłanie na e-mail djwrzosa@wp.pl. Z góry dziękuję i pozdrawiam.

dydko 29 czerwca 2011, 14:20

Fajny art, bardzo mi sie podoba ale ktoś by mógł dołączyć źrodła, sa małe błędy i dla kogoś zielonego to naprawde problem.

Xiro 21 sierpnia 2011, 17:56

A ja widzę błąd, nieznaczący - ale jest. A mianowicie - 360° to nie ani jeden radian, ani dwa, tylko 2? radiana, co wynosi około 6.283rad.

borsuk 22 sierpnia 2011, 19:07

Jestem początkujący w programu w C# i nie bardzo się orientuję gdzie mam wstawić metodę SetStyle(). Trzeba ją zdefiniować jako private void SetStyle() a potem wywoływać w programie? Jeśli tak to w którym miejscu? A jeśli nie to jak należy to zrobić?:)


Dodaj swój komentarz

»Zasady udzielania komentarzy

Autor:  
Komentarz:
Dodaj komentarz
© 2012 Onex Group
Onex Group O Onex Group  |  O CentrumXP.pl  |  Kontakt  |  Reklama
Nasze serwisy: CentrumXP.plXboxSpot.pl  |  Jama Mastaha