Deep Learning project build from scratch: Stock Predictor (3)
Front-end application dev: We’re about to done!
Day 3: Application Development — Front-end
A. Preface
In the previous two articles, we started with developing a button, controlling font, size and position, and created a user input column. Either, we modified the title, Icon and background of the window.
Nothing can stonewall us now!
In this article, we’ll turn the exercises we have done into the first prototype of our stock predictor!
Are you excited? let’s get it done!
B. Developing Application (Front-end)
a. Run chart
First, put LineEdit, Push Button & Label on the layout. (fig.1)
Next, we turn .ui into .py by PyUIC. Our file name is StockUI_1.
We wish our users can have their results after they pushed the button we had created in the first place.
We are starting to control all the components we had created. Although we do not have the run chart in the meantime, we temporarily replace it using a random chart on the net. We store the random 2884.png in my folder. Then, push pushButton and use QPixmap to load the chart in line 32–37. In these codes, we zoom, set the position and frame too.
In line 28–30, we set label_2 to print “Stock rising!!” in the settings of position and size if we click the button in the meantime.
Last, we use the experiences we have learnt: set Icon, monochrome background and window title to what we want! The results will be show as in Fig.2!
It’s gradually in shape now, isn’t it?
b. Time interval of run chart
Of course, we want our chart results is produced by the predictions of our neural nets. To make this happen, we have to put the predictions into our database, then us this application to form a run chart base on these predictions instantly.
Before all these, an idea hit our head: we may need a calendar to let our users choose the time interval they want to analysis.
So, we come up to fix this in the first place.
Drag 2 Label and 2 Date Edit on the layout. The two Date Edit are representing the start and end date. (fig.3)
Then we convert the file by PyUIC familiarly.
We are happened to control the Date Edit now. It would be nice the pop-out calendar will show up for our users to select as they click the button. The time interval they had selected will search for the right data in our database that will be created afterwards.
In this piece of code, we primarily added line 27–37 and the functions in line 39 & 43. In this place, the same codes we used is for readers to understand easily.
We set the maximum of date and time in line 27–28; create the pop-out calendar for users to select time in line 29; link the function we have mentioned above in line 39–41. In the function, we store the date selected by the users into variables d,m,y respectively, therefore we can search with these variables in our database afterwards. (fig.4)
Lastly, we print the variables in d,m,y by line 41. The function will be activated every once the input date has changed. In other words, the dates will be displayed in PyCharm as we select every time. Isn’t it cool?
C. Summary of front-end application dev
We are so happy to tell all of you who follow us till now: finally, our front-end application development is mostly done!
Therefore, here we want to make a small summary to conclude the dev all the way here.
You might be a little confused about the “crudeness” our app has present here. For example, we had not designed the elements to change their size basing on their window’s. In other words, the sizes of elements we had created will not zoom-in, even when the windows’ sizes had. This surly one of the needs for optimization in the future.
By the way, the program had not been packaged into an .exe, an executable file, because we want to finish all of the functions and link them all together before we wrap it up. In case wanting to package it now, you may search the keyword: Pyinstaller.
In this article we talked about how to read out our run chart and how to set the time interval of it.
In the next article, we may try to create our database by simple Web Crawler.
Then we’ll see in the next one!
Peace!
Oh, if you may want us to update more often, please let us know in the comment section below!
Then we’re good to go!
