We need to design an APP to send UDP message through different buttons/sliders. Each button/slider is associated with a text string value defined in Setting page. UDP packet destination IP and port number is defined in Setting page.
We also need to receive UDP message from remote device and display the message in a text window. This window can be enable/disable in Setting page.
We need to develop a Video window which can display a http video stream from a video source(from a python http video stream link). You can define the Video Source IP or http url in Setting page. This window can be enable/disable in Setting page.
Following UI is just for reference to interpret our idea, you can use other universal button icon, slider icon in the UI design.
Area 1 : The 3 dots setting icon is used to set the APP values including destination IP address, port number, the UDP message set by each button etc. When this icon is clicked, APP will go to Setting page.
Area 2 : This is a text area to display UDP message received from remote device. Auto roll up when ‘\r’ or ‘\n’ line changing message
Area 3 :Th http Video Area which will display ratio 640 x 480, video url will be defined in setting page
Area 4 :F1 to F8 buttons, when any of these buttons is clicked, a UDP message will be sent to destination IP address and port number. Setting page also can define the the specific message associated with each of the button.
Area 5 :Direction arrow buttons ◄ ► ▲ ▼, when any of these buttons is clicked, a UDP message will be sent to destination IP address and port number. Setting page also can define the the specific message associated with each of the arrow button.
Area 6 : In these area, we will show 4 sliders namely S1,S2,S3,S4.
Each slider can change value from 0 to 100 by default. when slider position changes, APP will send a UDP message to remote device standing for the current value of this slider. For example, when S1 changes to value 34, then send a message s1=34
Setting Page :
UDP Target IP : set the destination IP where UDP packet goes to , Port: set the port number of destination UDP packet
Default IP is 192.168.1.255 Default Port is:8888
Enable Toggle default value is ON , when toggle is ON, user can see the receiving text message Window. If it is OFF, then user can’t see receive message Windows
Video IP/Url : set video area stream source IP or URL , Port: set the port number of video source
Default IP is 192.168.1.254 Default Port is:8899
Enable Toggle default value is OFF. when toggle is ON, user can see the Video Window. If it is OFF, then user can’t see Video Windows.
Button Area : set UDP message sent by each button, for example , F1 default value is F, so if you don’t change the default value, a letter “F” will be sent to remote device by UDP when F1 is pressed.
Default value list:
F1: F , F2: G , F3:H, F4:I , F5:J , F6:K , F7: T , F8:O
▲:A , ▼:B , ◄:L , ►:R
There are 4 sliders in our APP: S1, S2,S3,S4
When any slider has changed value, APP will send the value to remote device by UDP. For example
When S1 changed from 0 to 20, APP will send a text message S1=20 to remote device.
Default of each slider range are all 0 to 100 . You can change the default range by changing the min value and max value of each slider.
We need develop APP in both iOS and Android System.
You need to provide source code and help us to upload the APP to our Apple Store and Google Play account.
DownLoad Url osoyoo.com