impuve UI to all screens

This commit is contained in:
2025-06-05 16:08:15 +03:00
parent 418ebc6f49
commit 8652940879
6 changed files with 214 additions and 142 deletions

0
anime.py Normal file
View File

37
main.py
View File

@@ -18,6 +18,8 @@ from kivy.uix.label import Label
from kivy.uix.boxlayout import BoxLayout from kivy.uix.boxlayout import BoxLayout
from threading import Thread from threading import Thread
from kivy.clock import mainthread from kivy.clock import mainthread
from kivy.uix.image import Image
from kivy.uix.behaviors import ButtonBehavior
kivy.require("2.0.0") kivy.require("2.0.0")
from kivy.core.window import Window from kivy.core.window import Window
@@ -346,7 +348,7 @@ class GetTripFromServer(Screen):
"""Handle the Get trip server data button press.""" """Handle the Get trip server data button press."""
selected_device = self.ids.devices_spinner.text selected_device = self.ids.devices_spinner.text
start_date = self.ids.start_date_picker_button.text start_date = self.ids.start_date_picker_button.text
end_date = self.ids.end_date_picker_button.text end_date = self.ids.end_date_picker.text
if selected_device == "Loading devices..." or selected_device == "No devices found": if selected_device == "Loading devices..." or selected_device == "No devices found":
print("No valid device selected.") print("No valid device selected.")
@@ -484,18 +486,24 @@ class HomeScreen(Screen):
row = BoxLayout( row = BoxLayout(
orientation="horizontal", orientation="horizontal",
size_hint_y=None, size_hint_y=None,
height=38, height=44,
spacing=6, spacing=6,
padding=(8, 4) padding=(8, 6)
) )
from kivy.graphics import Color, Rectangle from kivy.graphics import Color, Line, RoundedRectangle
with row.canvas.before: with row.canvas.before:
Color(0.11, 0.10, 0.15, 1) # Match app background Color(0.11, 0.10, 0.15, 1)
row.bg_rect = Rectangle(pos=row.pos, size=row.size) row.bg_rect = RoundedRectangle(pos=row.pos, size=row.size, radius=[6])
Color(0.341, 0.235, 0.980, 1)
row.border_line = Line(rounded_rectangle=[row.x, row.y, row.width, row.height, 6], width=1)
# Use a closure to bind the correct row instance
def make_update_bg_rect(r):
def update_bg_rect(instance, value): def update_bg_rect(instance, value):
row.bg_rect.pos = row.pos r.bg_rect.pos = r.pos
row.bg_rect.size = row.size r.bg_rect.size = r.size
row.bind(pos=update_bg_rect, size=update_bg_rect) r.border_line.rounded_rectangle = [r.x, r.y, r.width, r.height, 6]
return update_bg_rect
row.bind(pos=make_update_bg_rect(row), size=make_update_bg_rect(row))
project_label = Label( project_label = Label(
text=project, text=project,
@@ -506,13 +514,6 @@ class HomeScreen(Screen):
shorten_from='right' shorten_from='right'
) )
# Edit icon button
from kivy.uix.image import Image
from kivy.uix.behaviors import ButtonBehavior
class IconButton(ButtonBehavior, Image):
pass
edit_button = IconButton( edit_button = IconButton(
source="resources/images/edit.png", source="resources/images/edit.png",
size_hint_x=0.18, size_hint_x=0.18,
@@ -521,7 +522,6 @@ class HomeScreen(Screen):
) )
edit_button.bind(on_press=lambda instance, p=project: self.edit_project(p)) edit_button.bind(on_press=lambda instance, p=project: self.edit_project(p))
# Delete icon button
delete_button = IconButton( delete_button = IconButton(
source="resources/images/delete.png", source="resources/images/delete.png",
size_hint_x=0.18, size_hint_x=0.18,
@@ -600,6 +600,9 @@ class HomeScreen(Screen):
# Optionally, delete the project folder after archiving # Optionally, delete the project folder after archiving
self.delete_project(project_name) self.delete_project(project_name)
class IconButton(ButtonBehavior, Image):
pass
class TraccarApp(App): class TraccarApp(App):
def build(self): def build(self):
if not os.path.exists(RESOURCES_FOLDER): if not os.path.exists(RESOURCES_FOLDER):

View File

@@ -1 +1 @@
gAAAAABoQW_vdU_6k9K8_uHQSqyH5Ym29SpcwEe8z092nCaELg2i2aRJkhcPfDzPwuPLqo8vzHHKhIQpTXTMpm7s3PPqCy1Xok7lGAm5UJIRF2y9BNe77jH2fNENMN_ipmAT4QgNIAFs gAAAAABoQZZ4y4TyP0vsqVtL5HZvQvAvpF0KWgQHpqUHSdBgQGi0l-Qo1ZOEjNzPcnoXOxbGN6Q6knPNjzqTLxiqIdnxeN6fnX4PkYjWqSLx4USUYnws3XEK99p_YQMjOO0kcrXZUThD

View File

Before

Width:  |  Height:  |  Size: 23 KiB

After

Width:  |  Height:  |  Size: 23 KiB

View File

@@ -1,148 +1,207 @@
<LoginScreen>: <LoginScreen>:
BoxLayout: BoxLayout:
orientation: "vertical" orientation: "vertical"
padding: 20 padding: [16, 24, 16, 16]
spacing: 20 spacing: 14
canvas.before: canvas.before:
Color: Color:
rgba: 0.11, 0.10, 0.15, 1 # Background color: #1C1A27 rgba: 0.11, 0.10, 0.15, 1
Rectangle: Rectangle:
pos: self.pos pos: self.pos
size: self.size size: self.size
Widget:
size_hint_y: 0.10 # Spacer at the top
Image: Image:
source: "resources/track.png" source: "resources/images/track.png" # <-- updated path
size_hint: (1, 0.66) # 2/3 of the screen height size_hint: (1, 0.28) # Smaller logo for phones
allow_stretch: True
keep_ratio: True
Widget:
size_hint_y: 0.05 # Spacer
TextInput: TextInput:
id: username_input id: username_input
hint_text: "Username" hint_text: "Username"
multiline: False multiline: False
font_size: 20 # Text size font_size: 18
height: self.minimum_height height: 44
size_hint_y: None # Fix height size_hint_y: None
size_hint_x: 0.8 # Center horizontally size_hint_x: 1
pos_hint: {"center_x": 0.5} padding: [12, 12, 12, 12]
background_normal: ''
background_color: 0.15, 0.15, 0.18, 1
foreground_color: 1, 1, 1, 1
TextInput: TextInput:
id: password_input id: password_input
hint_text: "Password" hint_text: "Password"
multiline: False multiline: False
password: True password: True
font_size: 20 # Text size font_size: 18
height: self.minimum_height height: 44
size_hint_y: None # Fix height size_hint_y: None
size_hint_x: 0.8 # Center horizontally size_hint_x: 1
pos_hint: {"center_x": 0.5} padding: [12, 12, 12, 12]
background_normal: ''
background_color: 0.15, 0.15, 0.18, 1
foreground_color: 1, 1, 1, 1
Widget:
size_hint_y: 0.02 # Small spacer
BoxLayout: BoxLayout:
orientation: "horizontal" orientation: "horizontal"
size_hint_y: None size_hint_y: None
height: 50 # Fixed height for the button group height: 48
size_hint_x: 0.8 # Match the width of the TextInput fields
pos_hint: {"center_x": 0.5} # Center horizontally
spacing: 10 spacing: 10
Button: Button:
text: "Login" text: "Login"
font_size: 20 # Match the font size of the TextInput fields font_size: 18
size_hint_x: 0.5 # Half the width of the BoxLayout size_hint_x: 0.5
size_hint_y: None background_color: 0.341, 0.235, 0.980, 1
height: 50 # Fixed height for the button color: 1, 1, 1, 1
background_color: 0.341, 0.235, 0.980, 1 # Purple color (#573CFA)
on_press: root.login() on_press: root.login()
Button: Button:
text: "Register" text: "Register"
font_size: 20 font_size: 18
size_hint_x: 0.5 size_hint_x: 0.5
background_color: 0.341, 0.235, 0.980, 1
color: 1, 1, 1, 1
on_press: app.root.current = "register"
Widget:
size_hint_y: 0.08 # Spacer
Label:
id: result_label
text: ""
font_size: 15
size_hint_y: None size_hint_y: None
height: 50 height: 28
background_color: 0.341, 0.235, 0.980, 1 # Purple color (#573CFA) color: 1, 1, 1, 1
on_press: app.root.current = "register" # Navigate to the RegisterScreen
<RegisterScreen>: <RegisterScreen>:
BoxLayout: BoxLayout:
orientation: "vertical" orientation: "vertical"
padding: 20 padding: [16, 24, 16, 16]
spacing: 20 spacing: 14
canvas.before: canvas.before:
Color: Color:
rgba: 0.11, 0.10, 0.15, 1 # Background color: #1C1A27 rgba: 0.11, 0.10, 0.15, 1
Rectangle: Rectangle:
pos: self.pos pos: self.pos
size: self.size size: self.size
Widget:
size_hint_y: 0.08
Image: Image:
source: "resources/track.png" source: "resources/images/track.png"
size_hint: (1, 0.66) # 2/3 of the screen height size_hint: (1, 0.22)
allow_stretch: True
keep_ratio: True
Label:
text: "Register"
font_size: 22
color: 1, 1, 1, 1
size_hint_y: None
height: 36
TextInput: TextInput:
id: set_username_input id: set_username_input
hint_text: "Set Username" hint_text: "Username"
multiline: False multiline: False
font_size: 20 # Text size font_size: 18
height: self.minimum_height height: 44
size_hint_y: None # Fix height size_hint_y: None
size_hint_x: 0.8 # Center horizontally size_hint_x: 1
pos_hint: {"center_x": 0.5} padding: [12, 12, 12, 12]
background_normal: ''
background_color: 0.15, 0.15, 0.18, 1
foreground_color: 1, 1, 1, 1
TextInput:
id: set_email_input
hint_text: "Email"
multiline: False
font_size: 18
height: 44
size_hint_y: None
size_hint_x: 1
padding: [12, 12, 12, 12]
background_normal: ''
background_color: 0.15, 0.15, 0.18, 1
foreground_color: 1, 1, 1, 1
TextInput: TextInput:
id: set_password_input id: set_password_input
hint_text: "Set Password" hint_text: "Password"
multiline: False multiline: False
password: True password: True
font_size: 20 # Text size font_size: 18
height: self.minimum_height height: 44
size_hint_y: None # Fix height size_hint_y: None
size_hint_x: 0.8 # Center horizontally size_hint_x: 1
pos_hint: {"center_x": 0.5} padding: [12, 12, 12, 12]
background_normal: ''
background_color: 0.15, 0.15, 0.18, 1
foreground_color: 1, 1, 1, 1
TextInput: TextInput:
id: confirm_password_input id: confirm_password_input
hint_text: "Confirm Password" hint_text: "Confirm Password"
multiline: False multiline: False
password: True password: True
font_size: 20 # Text size font_size: 18
height: self.minimum_height height: 44
size_hint_y: None # Fix height size_hint_y: None
size_hint_x: 0.8 # Center horizontally size_hint_x: 1
pos_hint: {"center_x": 0.5} padding: [12, 12, 12, 12]
background_normal: ''
TextInput: background_color: 0.15, 0.15, 0.18, 1
id: set_email_input foreground_color: 1, 1, 1, 1
hint_text: "Set Email"
multiline: False
font_size: 20 # Text size
height: self.minimum_height
size_hint_y: None # Fix height
size_hint_x: 0.8 # Center horizontally
pos_hint: {"center_x": 0.5}
Widget:
size_hint_y: 0.02
BoxLayout:
orientation: "horizontal"
size_hint_y: None
height: 48
spacing: 10
Button: Button:
text: "Create Username" text: "Register"
font_size: 20 # Match the font size of the TextInput fields font_size: 18
size_hint_x: 0.8 # Match the width of the TextInput fields size_hint_x: 0.5
size_hint_y: None background_color: 0.341, 0.235, 0.980, 1
height: 50 # Fixed height for the button color: 1, 1, 1, 1
pos_hint: {"center_x": 0.5}
on_press: root.create_user() on_press: root.create_user()
Button: Button:
text: "Back to Login" text: "Back"
font_size: 20 font_size: 18
size_hint_x: 0.8 size_hint_x: 0.5
size_hint_y: None background_color: 0.341, 0.235, 0.980, 1
height: 50 color: 1, 1, 1, 1
pos_hint: {"center_x": 0.5}
on_press: app.root.current = "login" on_press: app.root.current = "login"
Widget:
size_hint_y: 0.06
Label: Label:
id: result_label id: result_label
text: "" text: ""
size_hint: (1, 0.2) font_size: 15
size_hint_y: None
height: 28
color: 1, 1, 1, 1
<HomeScreen>: <HomeScreen>:
BoxLayout: BoxLayout:
@@ -387,105 +446,115 @@
<SettingsScreen>: <SettingsScreen>:
BoxLayout: BoxLayout:
orientation: "vertical" orientation: "vertical"
padding: 20 padding: [16, 24, 16, 16]
spacing: 20 spacing: 14
canvas.before: canvas.before:
Color: Color:
rgba: 0.11, 0.10, 0.15, 1 # Background color: #1C1A27 rgba: 0.11, 0.10, 0.15, 1
Rectangle: Rectangle:
pos: self.pos pos: self.pos
size: self.size size: self.size
Image: Image:
source: "resources/track.png" source: "resources/images/track.png"
size_hint: (1, 0.66) # 2/3 of the screen height size_hint: (1, 0.22)
allow_stretch: True
keep_ratio: True
TextInput: TextInput:
id: server_url_input id: server_url_input
hint_text: "Traccar Server URL" hint_text: "Traccar Server URL"
multiline: False multiline: False
font_size: 20 font_size: 18
height: 44
size_hint_y: None size_hint_y: None
height: self.minimum_height size_hint_x: 1
size_hint_x: 0.8 padding: [12, 12, 12, 12]
pos_hint: {"center_x": 0.5} background_normal: ''
background_color: 0.15, 0.15, 0.18, 1
foreground_color: 1, 1, 1, 1
TextInput: TextInput:
id: username_input id: username_input
hint_text: "Username" hint_text: "Username"
multiline: False multiline: False
font_size: 20 font_size: 18
height: 44
size_hint_y: None size_hint_y: None
height: self.minimum_height size_hint_x: 1
size_hint_x: 0.8 padding: [12, 12, 12, 12]
pos_hint: {"center_x": 0.5} background_normal: ''
background_color: 0.15, 0.15, 0.18, 1
foreground_color: 1, 1, 1, 1
TextInput: TextInput:
id: password_input id: password_input
hint_text: "Password" hint_text: "Password"
multiline: False multiline: False
password: True password: True
font_size: 20 font_size: 18
height: 44
size_hint_y: None size_hint_y: None
height: self.minimum_height size_hint_x: 1
size_hint_x: 0.8 padding: [12, 12, 12, 12]
pos_hint: {"center_x": 0.5} background_normal: ''
background_color: 0.15, 0.15, 0.18, 1
foreground_color: 1, 1, 1, 1
TextInput: TextInput:
id: token_input id: token_input
hint_text: "Token" hint_text: "Token"
multiline: False multiline: False
font_size: 20 font_size: 18
height: 44
size_hint_y: None size_hint_y: None
height: self.minimum_height size_hint_x: 1
size_hint_x: 0.8 padding: [12, 12, 12, 12]
pos_hint: {"center_x": 0.5} background_normal: ''
background_color: 0.15, 0.15, 0.18, 1
foreground_color: 1, 1, 1, 1
BoxLayout: BoxLayout:
orientation: "horizontal" orientation: "horizontal"
size_hint_y: None size_hint_y: None
height: 50 height: 48
size_hint_x: 0.8
pos_hint: {"center_x": 0.5}
spacing: 10 spacing: 10
Button: Button:
text: "Test Connection" text: "Test Connection"
size_hint_x: 0.5 # Half the width of the BoxLayout font_size: 16
size_hint_y: None size_hint_x: 0.5
height: 50 background_color: 0.341, 0.235, 0.980, 1
background_color: 0.341, 0.235, 0.980, 1 # Purple color (#573CFA) color: 1, 1, 1, 1
on_press: root.test_connection() on_press: root.test_connection()
Button: Button:
text: "Save Settings" text: "Save Settings"
size_hint_x: 0.5 # Half the width of the BoxLayout font_size: 16
size_hint_y: None size_hint_x: 0.5
height: 50 background_color: 0.008, 0.525, 0.290, 1
background_color: 0.008, 0.525, 0.290, 1 # Purple color (#573CFA) color: 1, 1, 1, 1
on_press: root.save_settings() on_press: root.save_settings()
Label: Label:
id: result_label id: result_label
text: "Waiting to test connection..." text: "Waiting to test connection..."
font_size: 15
size_hint_y: None size_hint_y: None
height: 50 height: 28
size_hint_x: 0.8 color: 1, 1, 1, 1
pos_hint: {"center_x": 0.5} halign: "center"
canvas.before: valign: "middle"
Color: text_size: self.size
rgba: 1, 1, 1, 1 # White color padding: [0, 8]
Line:
width: 1.5
rectangle: self.x, self.y, self.width, self.height
Button: Button:
text: "Return to Home" text: "Return to Home"
size_hint_y: None size_hint_y: None
height: 50 height: 48
size_hint_x: 0.8 background_color: 0.341, 0.235, 0.980, 1
pos_hint: {"center_x": 0.5} color: 1, 1, 1, 1
background_color: 0.341, 0.235, 0.980, 1 # Purple color (#573CFA) font_size: 16
on_press: app.root.current = "home" on_press: app.root.current = "home"
<CreateAnimationScreen>: <CreateAnimationScreen>: