I'm pretty new on programing, totally new i'd say. I'm doing this just for personal reasons. I'm addicted to reading content online, and i usually end loosing the links for my readings. Although i know that there are other options, i'm trying to build a simple but functional app using python and kivy with the sole purpose of storing and redirecting to those reading links. The idea is to have a screen with a form to add a Image, a URl and a Title. The main screen should display the image with the title below and, when the image is clicked, it should open the URL.
Currently i'm using a database using tinyDB to save the data, but i couldn't find a way to properly display it as i want. 2 to 4 images side to side max.
If i manage to make this work, the next step is to implement a function to delete/update database infos.
Currently, nor my image is showing properly, nor i can open the link up clicking on the title. Also, i'm not great at FloatLayout, so it isn't sticking in the screen below the topbar, i guess.
Any suggestion is valid, as i'm most doing this for a personal reason and just searching step by step on the web.
Here is my .py:
from kivymd.app import MDApp
from kivy.lang import Builder
from kivy.uix.screenmanager import Screen, ScreenManager
from kivy.storage.jsonstore import JsonStore
from tinydb import TinyDB
from kivy.uix.gridlayout import GridLayout
import webbrowser
from kivy.uix.image import Image
from kivy.uix.label import Label
db = TinyDB("books.json")
class JanelaGerenciadora(ScreenManager):
pass
class JanelaPrincipal(Screen):
def load(self):
db.update({'titulonovel': self.titulonovel.text,
'urlnovel': self.urlnovel.text,
'imagemnovel': self.imagemnovel.text})
class Janela1(Screen):
def _init_ (self,**kwargs):
super(Janela1,self)._init_(**kwargs)
self.store = JsonStore('books.json')
def save(self):
db.insert({'titulonovel': self.titulonovel.text, 'urlnovel': self.urlnovel.text, 'imagemnovel': self.imagemnovel.text})
class BookDisplay(GridLayout):
def __init__(self, **kwargs):
super().__init__(**kwargs)
self.cols = 4
books = db.all()
for book in books:
book_layout = GridLayout(cols=1, size_hint_y=None)
book_layout.bind(minimum_height=book_layout.setter('height'))
img = Image(source=book.get("imagemnovel", ""), allow_stretch=False, keep_ratio=True)
img.bind(on_touch_down=lambda x, b=book: webbrowser.open(b["urlnovel"]))
book_layout.add_widget(img)
lbl = Label(text=book.get("titulonovel", ""), size_hint_y=None, height=40)
book_layout.add_widget(lbl)
self.add_widget(book_layout)
class MyApp(MDApp):
def build(self):
self.theme_cls.theme_style = "Dark"
self.theme_cls.primary_palette = "Pink"
self.title = 'My Novel Bib'
return Builder.load_file('main.kv')
MyApp().run()
and my .kv:
JanelaGerenciadora:
JanelaPrincipal:
Janela1:
<JanelaPrincipal>
name: "janelaprincipal"
FloatLayout:
MDTopAppBar:
title: "My Novel Bib"
pos_hint: {'center_x': 0.5, 'center_y': 0.95}
anchor_title: "left"
BoxLayout:
orientation: 'vertical'
padding: 20
spacing: 20
size_hint: (0.6, 0.6)
pos_hint: {'center_x': 0.5, 'center_y': 0.5}
GridLayout:
cols: 4
BookDisplay:
MDRaisedButton
text: '[size=30]+[/size]'
pos_hint: {'center_x': 0.95, 'center_y': 0.95}
size_hint: 0.01, 0.01
md_bg_color: app.theme_cls.primary_dark
on_release:
app.root.current = 'janela1'
<Janela1>
name: "janela1"
titulonovel: titulonovel
urlnovel: urlnovel
imagemnovel: imagemnovel
FloatLayout:
MDTopAppBar:
title: "Adicionar"
pos_hint: {'center_x': 0.5, 'center_y': 0.95}
anchor_title: "left"
MDTextField:
id: titulonovel
pos_hint: {'center_x': 0.5, 'center_y': 0.7}
size_hint_x: 0.8
mode: "rectangle"
hint_text:"Nome"
icon_left:"text"
MDTextField:
id: urlnovel
pos_hint: {'center_x': 0.5, 'center_y': 0.6}
size_hint_x: 0.8
mode: "rectangle"
hint_text:"URL"
icon_left:"link"
MDTextField:
id: imagemnovel
pos_hint: {'center_x': 0.5, 'center_y': 0.5}
size_hint_x: 0.8
mode: "rectangle"
hint_text:"URL da Imagem"
icon_left:"image"
MDRaisedButton
text: '[size=20]Adicionar[/size]'
pos_hint: {'center_x': 0.8, 'center_y': 0.4}
size_hint: 0.2, 0.01
md_bg_color: app.theme_cls.primary_dark
on_press:
root.save(); imagemnovel.text=''; urlnovel.text=''; titulonovel.text=''
on_release:
app.root.current = 'janelaprincipal'
MDRaisedButton
text: '[size=25]H[/size]'
pos_hint: {'center_x': 0.95, 'center_y': 0.95}
size_hint: 0.01, 0.01
md_bg_color: app.theme_cls.primary_dark
on_release:
app.root.current = 'janelaprincipal'
json file structured this way:
{"_default": {"1": {"titulonovel": "bom dia", "urlnovel": "https://manhwatop.com/manga/ancient-godly-monarch/", "imagemnovel": "https://static.wikia.nocookie.net/ancient-godly-monarch/images/1/14/Screen_Shot_2017-12-14_at_8.27.56_PM.png/revision/latest?cb=20171214122834"}, "2": {"titulonovel": "Ancient Godly Monarch\t", "urlnovel": "https://manhwatop.com/manga/ancient-godly-monarch/", "imagemnovel": "https://static.wikia.nocookie.net/ancient-godly-monarch/images/1/14/Screen_Shot_2017-12-14_at_8.27.56_PM.png/revision/latest?cb=20171214122834"}}}
main screen current look when i open the app, 2 test data on database books.json
I've searched here and on other communities about the image problem and found that it could be related to the app not being able to find url using https. I've tried to search AsyncImage but didn't understood how to apply it, nor if this was really the problem.
I've thought about changing the image from URL to browse local search on the final app, but couldn't think of a way to add it to the json file. I've started like this last week, but ended changing to image url to add it to the database.
I'm using a button to change pages because i'm not familiar with the menu behavior, so i kept it functional over beauty for now. The same goes to the delete/modify button, no idea how to add it without breaking the structure to load the database.
