Tak siedzę przed monitorem i zastanawiam się jak tu zacząć

I chyba zacznę prosto z mostu

Wielu z Was robi różne projekty na AVR-ach ale czasem brakuje możliwości prezentacji działania takiego układu na
PC z prozaicznego powodu, brakuje odpowiednich kontrolek.
Otóż sprawa wcale nie jest z góry przegrana, bo takie cuda robi się prościej niż wam się wydaje co udowodnię Wam

Kontrolki można "stworzyć" w C# na wiele różnych sposobów np. używając GDI+ czy też WPF.
Ja na razie wybiorę GDI+ chociażby z chęci przypomnienia sobie tego cuda (w końcu zaczyna się niedługo semestr i lepiej przypomnieć sobie co nie co )

No to do dzieła

Odpalamy VS --> Nowy project --> Windows Forms Control Library i nazywamy ją np:kontrolki_avr



Po tej operacji ukaże nam się takie okienko



Zaglądamy do Solution Explorer i zmieniamy nazwę naszej kontrolki z "UserControl1" na "Wskaznik"
Gdy wyskoczy nam komunikat jak na obrazku bez wahania się zgadzamy (będzie mniej roboty )



Po tej operacji odnajdujemy class Wskaznik i klikamy na niej dwa razy



I już nareszcie zabieramy się do właściwego projektowania i zaprogramowania naszej kontrolki która będzie wyglądała tak :



No to do dzieła.

Zaglądamy jeszcze do Wskaznik.cs(design) i we właściwościach ustawiamy wielkość naszej kontrolki na Width=300 Height = 150 ,
następnie odnajdujemy BorderStyle i suatwiamy na FixedSingle.
Po tych czynnościach wracamy z powrotem do Wskaznik.cs

Na początek musimy podłączyć sobie referencję do rysowania 2D co czynimy na początku pliku w następujący sposób

Po dodaniu referencji warto by się zastanowić jakie własności czy też właściwości będą nam potrzebne
( przed tym etapem gorąco polecam przeprosić się z kartką a także ołówkiem i rozrysować sobie przyszłą kontrolkę co ułatwi późniejsze pisanie kodu )
ja wybrałem takie jak:
- Wartość aktualna
- Wartość Maksymalna
- Wartość Minimalna
- różne grubości linii oraz kolory które będą potrzebne do rysowania
- oraz fonty do cyferek
i teraz plik wskazniki.cs u mnie wygląda tak:

Jak widać zmienne z wartościami domyślnymi są prywatne bo przecież nie chcemy aby ktoś niepowołany miał do nich dostęp, zresztą i tak dobudujemy do nich "logikę"
która umożliwi nam zmianę tych wartości nie jako z zewnątrz.

A skoro już o tym mowa, w/w logika wygląda tak:

Tutaj zatrzymamy się na chwilkę aby wyjaśnić co robią poszczególne linie:
Pierwsza linia mówi nam że ta właściwość ma być widoczna we właściwościach kontrolki (Properties),
gdy w tej linii zmienimy wartość true na false nie będzie ona dostępna. Czasami zachodzi potrzeba debugowania jakieś zmiennej która ogólnie
później ma być nie dostępna ...

Druga linia wskazuje jak się nazywa grupa właściwości w której ma być zlokalizowana nasza wartość, można wpisać tutaj dowolną nazwę lub nazwę znajdującą się już we właściwościach
Trzecia linia to nic innego jak opis tego co ta opcja zmienia.
Dalej to już standardowe wykorzystanie akcesorów, gdzie:
get - pobiera wartość ze zmiennej i wystawia ją na zewnątrz
set - ustawia wartość zmiennej. Dodatkowo w set można ustawić dodatkowe warunki sprawdzenia wartości przed wpisaniem jej na swoje miejsce, co zresztą
uczyniłem poprzez warunek if. Skoro już jesteśmy przy nim dlatego został w ten sposób napisany aby zapobiec ciągłemu "przerysowywaniu" naszej kontrolki przy zmianie wartości a raczej braku jej zmiany.

Dla chcących troszkę poklepać zamieszczam logikę


Dla ciekwaskich którzy mają chęć zobaczyć efekty pracy zachęcam do użycia klawisza F5, gdzie po wciśnięciu go powinno ukazać nam się takie okienko



Jak widzicie na razie efekty naszego pisania pojawiły się w prawym okienku właściowści naszej kontrolki w postaci parametrów.

Dzięki tym wszystkim operacjom mamy juz przygotowane pole do utworzenia właściwego wyglądu, który zaczniem od utworzenia funkcji nadpisującej rysowanie kontrolki,
a wygląda ona tak:


I zaczynamy pisanie zaraz pod base.OnPaint(e);
Na początek powołamy do życia kilka lokalnych zmiennych pomocniczych które ułatwia nam obliczenia oraz pisanie kodu.

Zmienne które przechowują wartości kątów dla elpisy która jest na zewnątrz skali oraz zmienne niezbędne do jej utworzenia

Struktura text umożliwi nam później sprawdzenie wielkości szerokości i wysokości tekstu która umożliwi nam prawidłowe pozycjonowanie go
oraz struktura przechowująca punkt centralny dla elipsy.

Ogranicznie blokujące proporcje kontrolgi żeby nam się nie rozjeżdżała.

Powołyjemy do życia "ołówek" którym będziemy rysować po kontrolce oraz strukturę która umożliwia wypełnienie kształtów kolorem

Będzie także potrzebna nam struktura która umożliwia rysowanie dowolnego kształtu

No to czas na naszą pierwszą łuk, a raczej jego fragment
Pierwszy parametr to nasz ołówek który został zdefiniowany chwilkę wcześniej podczas deklaracji
Następnie dwa zera które odpowiadają połóżeniu prostokąta w który będzie wrysowany łuk,
kolejne dwie wartości odpowiadają za rozmiar tego prostokątka, następnie podajemy kąt od którego ma być rozpoczętę rysowanie i
ostatnia wartość to jak rozwarty ma być nasz łuk.


Dla ciekawskich F5

Przed przystąpieniem do dalszego rysowania stworzymy sobie jeszcze przywatną metodą do przeliczenia stopni na radiany
którą możecie umieścić na końcu klasy Wskaznik a wygląda ona tak:


Skoro już możemy przeliczać na radiany to przystępujemy do narysowania skali, w tym celu wykorzystamy pętlę while która zakończy się w momencie osiągnięcia zadanego kąta
Same obliczenia są na tyle proste że nie ma sensu ich wyjaśniać, może tylko napiszę że został wykorzystany wzór na znalezienie dowolnego punktu
na elipsie (zmienne x..,y.. itd.)


Dla ciekawskich F5 (jak komuś przeszkadza wielkość czcionki na skali to sobie może zmieć w prawym okienku )
A dla leniwych cała dotychczasowa zawartość kodu

Skoro mamy już tak dużo to teraz wypadało by skonstruować jakąś wskazówkię która by pokazywała nam bierzącą wartość
I znowu nic ciekawego, kolejne obliczenia po elipsie, przypisanie do "ołówka" koloru oraz grubości kreski oraz samo wyrysowanie wskazówki za pośrednictwem linii.
Może warto nadmienić że linie rysuje się troszkę innaczej niż pozostałe figury, po prostu podaje się początek oraz koniec linii w postaci współrzędnych.
Należy tylko pamiętać że tutaj jest troszkę innaczej niż przy współżędnych kartezjańskich dlatego że punkt (0,0) jest w górnym lewym rogu .....


No cóż po woli zbliżamy się już do końca, dlatego wypadało by położyć przysłowiowa wisienkę na trocie
W postaci pół elipsy po środku na kórej będą prezentowane aktualne wartości.
Tym razem wykorzystamy do tego klasę GraphicsPath a to dlatego że chciałem uzyskać dodatkowe obramowanie elipsy a już nie chciało mi sie klepać kodu


Dla ciekawskich F5

Tak się przyglądamy tej naszej kontrolce ... i co ? Wygląda jakoś kanciasto , więc czym prędzej biegniemy w naszej metodzie na początek
i zaraz za


klepiemy tą linijke kodu która włączy nam AntiAliasing żeby nasza kontrolka wyglądała po ludzku.



Dodatkowo warto też włąćzyć podwójne buforowanie żeby kontrolka nie mrygała nam podczas szybkich zmian wartości,
robi się to w public Wskaznik() który powinien wyglądać tak:

I jak zwykle dla leniwych cały kod

A teraz nie pozostaje już nam nic innego jak utworzyć nowy projekt
, zajrzeć do menu TOOLS --> Chooice toolbox items
zakładka .Net FrameWork Components
następnie Browse i wskazać naszą dll-ke która znajduje się w katalogu bin\debug naszego projektu

P.S tak jak obiecałem dołączam bibliotekę i projekt

Kawał dobrej roboty. Brawo.

_________________
http://www.jaglarz.info

Ja bym nawet dodał - że kawał DOBREJ, SOLIDNEJ ROBOTY, przyda się oj przyda ....

Niedługo na naszym forum będzie można zebrać naprawdę super poradnik - taki praktyczny do C#

Brawo aż sam się cieszę, że będę miał co poczytać

_________________
zapraszam na blog: http://www.mirekk36.blogspot.com (mój nick Skype: mirekk36 ) [ obejrzyj Kurs EAGLE ] [ mój kanał YT TV www.youtube.com/mirekk36 ]

Cieszę się że się komuś to przyda
Jak będę miał jeszcze chwilkę to postaram się troszkę bardziej zgłębić temat.

Ja nie mogę znaleźć "Windows Forms Control Library" wponiżej foto.



Trzeba coś doinstalować?

Dzięki i proszę więcej takich poradników.

Najpierw musisz założyć projekt a następnie jak masz widok formatki to na belce pod menu głównym masz coś takiego jak add i to klikasz a następnie klikasz na Windows Forms Control Libary.

Pozdrawiam!

P.S Malutki_27 fajny poradnik i chylę czoła nad taką fajną kontrolką bo pewnie "trochę" roboty ciebie kosztowało zrobić taki wskaźnik analogowy w GDI .

Zawsze możesz uruchomić wiersz poleceń w trybie administratora, zajrzeć do folderu IDE w lokalizacji dysk:\Program Files (x86)\Microsoft Visual Studio 11.0\Common7\IDE ( lokalizacja dla VS 2012 ver. 32bit ) i odpalić devenv /installvstemplates

Po tym powinny się pojawić dodatkowe szablony , a jeżeli się nie pojawią to daj znać i będziemy kombinować

Albo zrób jak radzi Michał ale wtedy kontrolka będzie bezpośrednio w projekcie i żeby ją obejrzeć to musisz ją umieścić na formularzu.



No to się cieszę że udało mi się wstrzelić w ciekawy temat

Wbrew pozorom jest nie jest to trudne, a tutaj zaledwie liznąłem temat , na szczęście mam jeszcze parę kontrolek w zanadrzu ale na razie cicho sza bo muszę obmyśleć ich działanie i może tym razem zahaczę o event'y których w ogóle nie ruszyłem tutaj i może napiszę coś z macierzami

Kombinuje jak koń pod górę i nie daje rady znaleźć "Windows Forms Control Library".
nawet zainstalowałem nowszą wersje Microsoft Visual Studio 2012.
Po utworzeniu nowego projektu klikam na add i:
Visual 2010


a w Visual 2012



wybieram USerControl. ale chyba to nie jest to.



Mam wersie express może tu coś jest nie tak?

Po dodaniu kontrolki do projektu. wyskakuje błąd:


pewnie coś nie tak z framework?

A przecież masz wyraźnie napisane, że czepia się namespace czy przestrzeni nazw. Tworząc projekt, tworzy się automatycznie jakiś namespace, jeżeli mnie pamięć nie zawodzi to nazywa się tak jak nazwa projektu. Ty pomieszałeś pewnie dwa z różnych i stąd problem.

_________________
sig off ;(

To jest, to tylko według sposobu który podał ci MichałXY.

Różnica pomiędzy tym jak ja pokazałem a tym co pokazał Michał jest taka że, w moim przypadku tworzysz pliczek dll , natomiast tak jak Michał pokazał kontrolkę nie jako wbudowujesz w swoją aplikację.



Aby zmienić framework w projekcie wystarczy w Solution Explorer kliknąć prawym przyciskiem myszy na kontrolki_avr, wybrać właściwości


Następnie application i już jesteśmy tam gdzie trzeba




Dodałem skompilowaną kontrolkę na Framework 4.0.


Co do namespace jak masz chęć dowiedzieć się co jest nie tak, to zamieść spakowany projekt , wtedy będzie można powiedzieć gdzie jest problem.

Bo na razie można jedynie odpowiedzieć tak jak napisał @arturf209

Kod który skopiowałem nie działa -,-

Znaczy się że źle skopiowałeś

Jesteś wielki. Wpadnij do mnie na piwo
Dla tych co mają MS Visual Expres podaję jak utworzyć control lib.
Visual C# Express 2008 does not come with a project template for creating custom controls (.dll files). You can create your own template by following these steps:

1. Open Visual C# Express 2008.
2. Create New WPF Application with name: MyLibrary
3. Project > Add User Control
4. In Solution Explorer, Delete Window1.xaml and App.xaml (the corresponding .cs files should be deleted by this step)
5. Project > MyLibrary Properties > Application > Output Type = Class Library
6. Build Solution - F6. There should be no errors and the bin/Release folder should have a MyLibrary.dll file
7. File > Export Template
8. Select Project Template then Next
9. Under Template Options change name to: WPF Control Library and Description: Create WPF Control .dll

The next time you open VS, you will find your newly created template ready to use.

Kiedy już stworzysz control library, stwórz nowy projekt. W zakładce Tools/Choose Toolbox Items/.NET Framework Component wciśnij browse aby odnaleźć bibliotekę. Szukaj tam gdzie ją zapisałeś. Kiedy się pojawi zaznacz ptaszka i wciśnij ok. Od tej pory masz kontrolkę kolegi Malutki_27. I nie pisz, że nie umiesz angielskiego, lub czy da się krócej. On się namęczył tobie przypada nauka tworzenia i dodawania własnych kontrolek dzięki temu prostemu tutorialowi.