Update 'Analog Clock'
parent
c846001e69
commit
27a00c2486
@ -53,7 +53,7 @@ We will do this in `OnUserUpdate()`:
|
||||
return true;
|
||||
}
|
||||
```
|
||||
[[***Try it out!***]](https://pgetinker.com/s/9PzMu2bRS6b "Click to try it out!")
|
||||
<a href="https://pgetinker.com/s/9PzMu2bRS6b" title="Click to try it out!" target="_blank">[***Try it out!***]</a>
|
||||
|
||||
[<img src="https://pit.pgetinker.com/SaoLD897rXSC.png" width="256" height="240">](https://pgetinker.com/s/9PzMu2bRS6b "Click to try it out!")
|
||||
|
||||
@ -159,7 +159,8 @@ Great! Another way to think about this is if π is half a revolution, then divid
|
||||
```
|
||||
|
||||
A little cleaner, and an alternative solution! Choose the one you like the most. The new result looks good! The angles are now correct.
|
||||
[[***Try it out!***]](https://pgetinker.com/s/Y50E2kQVebK "Click to try it out!")
|
||||
|
||||
<a href="https://pgetinker.com/s/Y50E2kQVebK" title="Click to try it out!" target="_blank">[***Try it out!***]</a>
|
||||
|
||||
[<img src="https://pit.pgetinker.com/bnXBYvs1tzb0.png" width="256" height="240">](https://pgetinker.com/s/Y50E2kQVebK "Click to try it out!")
|
||||
|
||||
@ -232,6 +233,67 @@ Very nice. Just to make it look a little cooler, I'm going to make the numbers b
|
||||
```
|
||||
|
||||
Tidied up the code with some separation, comments, and moved the dots slightly further back while adding `olc::GREY` as the coloring for the clock numbers.
|
||||
[[***Try it out!***]](https://pgetinker.com/s/y5OwBA5pHJ "Click to try it out!")
|
||||
|
||||
<a href="https://pgetinker.com/s/y5OwBA5pHJ" title="Click to try it out!" target="_blank">[***Try it out!***]</a>
|
||||
|
||||
[<img src="https://pit.pgetinker.com/RccUk1rcxfc4.png" width="256" height="240">](https://pgetinker.com/s/y5OwBA5pHJ "Click to try it out!")
|
||||
|
||||
## Getting Current Time
|
||||
The next step is getting the system time. C++ provides us with a system clock in `std::chrono::system_clock::now()`. Unfortunately there are few ways to extra number of seconds from this form, so we are going to convert it to a classical `time_t` structure (a value holding the number of seconds since the epoch) to where it breaks things down into a `tm` structure which gives us exactly the number of hours, minutes, and seconds this time contains at this moment.
|
||||
```cpp
|
||||
using namespace std::chrono;
|
||||
std::time_t time{system_clock::to_time_t(system_clock::now())};
|
||||
std::tm*localTime{std::localtime(&time)};
|
||||
```
|
||||
The code is a little cryptic (working with the `chrono` library tends to be a challenge). With the local time now converted to a `std::tm*` structure, we have direct access to the data we need now through the `tm_hour`, `tm_min`, and `tm_sec` members. Let's display them on the clock formatted appropriately.
|
||||
```cpp
|
||||
const std::string timeText{std::format("{:02}:{:02}:{:02}",localTime->tm_hour,localTime->tm_min,localTime->tm_sec)};
|
||||
const olc::vf2d timeTextSize{GetTextSize(timeText)};
|
||||
DrawStringDecal(GetScreenSize()/2+olc::vi2d{0,15}-timeTextSize/2,timeText);
|
||||
```
|
||||
Again we do some centering of the text so it appears proper.
|
||||
|
||||
<img src="https://pit.pgetinker.com/fUj1K6CZnlmt.png" width="256" height="240">
|
||||
|
||||
I noticed I am repeating some code again so I am going to condense the centered text rendering code into its own function.
|
||||
```cpp
|
||||
template<typename T>
|
||||
void DrawCenteredStringDecal(const olc::v2d_generic<T>&pos,const std::string&text,const olc::Pixel&col=olc::WHITE,const olc::v2d_generic<T>&scale={1,1}){
|
||||
const olc::v2d_generic<T>textSize{GetTextSize(text)};
|
||||
DrawRotatedStringDecal(pos,text,0.f,textSize/2,col,scale);
|
||||
}
|
||||
|
||||
bool OnUserUpdate(float fElapsedTime) override
|
||||
{
|
||||
Clear(olc::VERY_DARK_GREEN);
|
||||
|
||||
using namespace std::chrono;
|
||||
std::time_t time{system_clock::to_time_t(system_clock::now())};
|
||||
std::tm*localTime{std::localtime(&time)};
|
||||
|
||||
DrawCenteredStringDecal(GetScreenSize()/2+olc::vi2d{0,15},std::format("{:02}:{:02}:{:02}",localTime->tm_hour,localTime->tm_min,localTime->tm_sec));
|
||||
|
||||
DrawCircle(GetScreenSize()/2,100);
|
||||
|
||||
for(int i{0};i<12;i++){
|
||||
using namespace std::numbers;
|
||||
|
||||
//Draw decorative dots
|
||||
olc::vf2d drawVec{60,float(i*(pi/6)-pi/3)};
|
||||
Draw(GetScreenSize()/2+drawVec.cart());
|
||||
|
||||
//Draw clock numbers
|
||||
olc::vf2d numberVec{drawVec};
|
||||
numberVec.x=90; //Adjusted further towards the edge of the clock.
|
||||
DrawCenteredStringDecal(GetScreenSize()/2+numberVec.cart(),std::format("{}",i+1),olc::GREY);
|
||||
}
|
||||
return true;
|
||||
}
|
||||
```
|
||||
Creating a template function for `DrawCenteredStringDecal` allows it to be compatible with `olc::vi2d` and `olc::vf2d` types together, which just reduces error clutter. Very unnecessary in all honesty, just keeps the error window clean.
|
||||
|
||||
We can see the number of lines being reduced down with both center drawing sections now being reduced to one line. Cleaner code for the upcoming final section of this mini project.
|
||||
|
||||
<a href="https://pgetinker.com/s/PKYcskPM1-i" title="Click to try it out!" target="_blank">[***Try it out!***]</a>
|
||||
|
||||
[<img src="https://pit.pgetinker.com/lmKm32AeLCb6.png" width="256" height="240">](https://pgetinker.com/s/PKYcskPM1-i "Click to try it out!")
|
||||
|
Loading…
x
Reference in New Issue
Block a user