Heim > Backend-Entwicklung > Python-Tutorial > Wie erstelle ich mit ttkbootstrap eine schöne Schnittstelle für die Python-GUI?

Wie erstelle ich mit ttkbootstrap eine schöne Schnittstelle für die Python-GUI?

WBOY
Freigeben: 2023-05-07 15:40:08
nach vorne
2871 Leute haben es durchsucht

Diese beiden Bilder sind Screenshots der auf der offiziellen Website bereitgestellten Display-Renderings:

Wie erstelle ich mit ttkbootstrap eine schöne Schnittstelle für die Python-GUI?

#🎜🎜 # Wie erstelle ich mit ttkbootstrap eine schöne Schnittstelle für die Python-GUI?

Themenwechsel

Einfacher Themenwechsel, da im aktuellen Fenster nur wenige Komponenten vorhanden sind, ist der Effekt nicht offensichtlich, sieht aber gut aus, wenn viele Komponenten eingelegt sind aus.

Wie erstelle ich mit ttkbootstrap eine schöne Schnittstelle für die Python-GUI?

import ttkbootstrap as ttk
from ttkbootstrap.constants import *
root = ttk.Window()
style = ttk.Style()
theme_names = style.theme_names()#以列表的形式返回多个主题名
theme_selection = ttk.Frame(root, padding=(10, 10, 10, 0))
theme_selection.pack(fill=X, expand=YES)
lbl = ttk.Label(theme_selection, text="选择主题:")
theme_cbo = ttk.Combobox(
        master=theme_selection,
        text=style.theme.name,
        values=theme_names,
)
theme_cbo.pack(padx=10, side=RIGHT)
theme_cbo.current(theme_names.index(style.theme.name))
lbl.pack(side=RIGHT)
def change_theme(event):
    theme_cbo_value = theme_cbo.get()
    style.theme_use(theme_cbo_value)
    theme_selected.configure(text=theme_cbo_value)
    theme_cbo.selection_clear()
theme_cbo.bind(&#39;<<ComboboxSelected>>&#39;, change_theme)
theme_selected = ttk.Label(
        master=theme_selection,
        text="litera",
        font="-size 24 -weight bold"
)
theme_selected.pack(side=LEFT)
root.mainloop()
Nach dem Login kopieren

ttkbootstrap Eine einfache Einführung in die Verwendung von

Zunächst eine kurze Einführung in die Instanziierung zum Erstellen von Anwendungsfenstern. 🎜🏜 🎜 #
import ttkbootstrap as ttk
#实例化创建应用程序窗口
root = ttk.Window(
        title="窗口名字",        #设置窗口的标题
        themename="litera",     #设置主题
        size=(1066,600),        #窗口的大小
        position=(100,100),     #窗口所在的位置
        minsize=(0,0),          #窗口的最小宽高
        maxsize=(1920,1080),    #窗口的最大宽高
        resizable=None,         #设置窗口是否可以更改大小
        alpha=1.0,              #设置窗口的透明度(0.0完全透明)
        )
# root.place_window_center()    #让显现出的窗口居中
# root.resizable(False,False)   #让窗口不可更改大小
# root.wm_attributes(&#39;-topmost&#39;, 1)#让窗口位置其它窗口之上
root.mainloop()
Nach dem Login kopieren

Eingabefeld

import ttkbootstrap as ttk
from ttkbootstrap.constants import *
root = ttk.Window()
ttk.Label(root,text="标签1",bootstyle=INFO).pack(side=ttk.LEFT, padx=5, pady=10)
ttk.Label(root,text="标签2",boot).pack(side=ttk.LEFT, padx=5, pady=10)
ttk.Label(root,text="标签3",boot).pack(side=ttk.LEFT, padx=5, pady=10)
ttk.Label(root, text="标签4", bootstyle=WARNING, font=("微软雅黑", 15), background=&#39;#94a2a4&#39;).pack(side=LEFT, padx=5, pady=10)
root.mainloop()
&#39;&#39;&#39;
# bootstyle colors
PRIMARY = &#39;primary&#39;
SECONDARY = &#39;secondary&#39;
SUCCESS = &#39;success&#39;
DANGER = &#39;danger&#39;
WARNING = &#39;warning&#39;
INFO = &#39;info&#39;
LIGHT = &#39;light&#39;
DARK = &#39;dark&#39;

# bootstyle types
OUTLINE = &#39;outline&#39;
LINK = &#39;link&#39;
TOGGLE = &#39;toggle&#39;
INVERSE = &#39;inverse&#39;
STRIPED = &#39;striped&#39;
TOOLBUTTON = &#39;toolbutton&#39;
ROUND = &#39;round&#39;
SQUARE = &#39;square&#39;
&#39;&#39;&#39;
Nach dem Login kopieren
Wie erstelle ich mit ttkbootstrap eine schöne Schnittstelle für die Python-GUI?Textfeld

import ttkbootstrap as ttk
from ttkbootstrap.constants import *
root = ttk.Window()
ttk.Button(root, text="Button 1", bootstyle=SUCCESS).pack(side=LEFT, padx=5, pady=10)
ttk.Button(root, text="Button 2", bootstyle=(INFO, OUTLINE)).pack(side=LEFT, padx=5, pady=10)
ttk.Button(root, text="Button 3", bootstyle=(PRIMARY, "outline-toolbutton")).pack(side=LEFT, padx=5, pady=10)
ttk.Button(root, text="Button 4", boot).pack(side=LEFT, padx=5, pady=10)
ttk.Button(root, text="Button 5", boot).pack(side=LEFT, padx=5, pady=10)
ttk.Button(root, text="Button 6", state="disabled").pack(side=LEFT, padx=5, pady=10) #在禁用状态下创建按钮
root.mainloop()
Nach dem Login kopieren
# 🎜 ? Auswahl Button

import ttkbootstrap as ttk
from ttkbootstrap.constants import *
root = ttk.Window()
#为按钮添加点击事件
#法一
def button1():
    print("Button1点击了一下!")
ttk.Button(root,text="Button1", bootstyle=(PRIMARY, "outline-toolbutton"),command=button1).pack(side=LEFT, padx=5, pady=10)
#法二
def button2(event): #这里要加一个参数,不然会报错
    print("Button2点击了一下!")
    button_text = event.widget["text"] #得到按钮上的文本
    print(button_text)
b = ttk.Button(root,text="Button2", bootstyle=(PRIMARY, "outline-toolbutton"))
b.pack(side=LEFT, padx=5, pady=10)
b.bind("<Button-1>", button2) #<Button-1>鼠标左键
root.mainloop()
Nach dem Login kopieren
Wie erstelle ich mit ttkbootstrap eine schöne Schnittstelle für die Python-GUI?ComboBox

import ttkbootstrap as ttk
from ttkbootstrap.constants import *
root = ttk.Window()
e1 = ttk.Entry(root,show=None)
e1.insert(&#39;0&#39;,"默认插入内容")
e1.grid(row=5, column=1, sticky=ttk.W, padx=10,pady=10)
e2 = ttk.Entry(root,show="*",width=50,bootstyle=PRIMARY)
e2.grid(row=10, column=1, sticky=ttk.W, padx=10, pady=10)
e3_content = ttk.StringVar()
e3 = ttk.Entry(root,bootstyle=&#39;success&#39;, textvariable=e3_content).grid(row=15, column=1, sticky=ttk.W, padx=10, pady=10)
def get_entry_contetn():
    print("e1: ",e1.get())
    print("e2: ",e2.get())
    print("e3: ",e3_content.get())
ttk.Button(root,text="get_entry_contetn", bootstyle=(PRIMARY, "outline-toolbutton"),command=get_entry_contetn).grid(row=20, column=1, sticky=ttk.W, padx=10, pady=10)
root.mainloop()
Nach dem Login kopieren

Rahmen und Etikettenrahmen# 🎜🎜 #

Wie erstelle ich mit ttkbootstrap eine schöne Schnittstelle für die Python-GUI?

import ttkbootstrap as ttk
from ttkbootstrap.constants import *
root = ttk.Window()
text = ttk.Text(root,)
text.pack(padx=10,pady=10,fill=BOTH)
text.insert(&#39;insert&#39;,&#39;text-content 1&#39;) #插入内容
text.delete("0.0",&#39;end&#39;) #删除内容
text.insert(&#39;insert&#39;,&#39;text-content 2\npy&#39;)
text.see(ttk.END) #光标跟随着插入的内容移动
root.mainloop()
Nach dem Login kopieren

instrument

Wie erstelle ich mit ttkbootstrap eine schöne Schnittstelle für die Python-GUI?

import ttkbootstrap as ttk
from ttkbootstrap.constants import *
root = ttk.Window()
de1 = ttk.DateEntry()
de1.grid(row=6, column=1, sticky=ttk.W,padx=10, pady=10)
print(de1.entry.get())

de2 = ttk.DateEntry(boot,dateformat=r"%Y") #r"%Y-%m-%d"
de2.grid(row=6, column=2, sticky=ttk.W,padx=10, pady=10)
def get_dataentry():
    print(de2.entry.get())
ttk.Button(root,text="get_dataentry", bootstyle=(PRIMARY, "outline-toolbutton"),command=get_dataentry).grid(row=20, column=1, sticky=ttk.W, padx=10, pady=10)
root.mainloop()
Nach dem Login kopieren

Fortschrittsbalken

#🎜 🎜#

Wie erstelle ich mit ttkbootstrap eine schöne Schnittstelle für die Python-GUI?

import ttkbootstrap as ttk
root = ttk.Window()
variable_value = ttk.StringVar()
variable_value_dist = {
    "0":"男",
    "1":"女",
    "2":"未知"
}
ttk.Radiobutton(root, text=&#39;男&#39;, variable=variable_value, value=0).pack(side=ttk.LEFT, padx=5)
ttk.Radiobutton(root, text=&#39;女&#39;, variable=variable_value, value=1).pack(side=ttk.LEFT, padx=5)
ttk.Radiobutton(root, text=&#39;未知&#39;, variable=variable_value, value=2).pack(side=ttk.LEFT, padx=5)
def ensure():
    print(variable_value_dist[variable_value.get()])
ttk.Button(text="确定", command=ensure).pack(side=ttk.LEFT, padx=5)
root.mainloop()
Nach dem Login kopieren

Scale

Wie erstelle ich mit ttkbootstrap eine schöne Schnittstelle für die Python-GUI?

import ttkbootstrap as ttk
root = ttk.Window()
variable_content = [
    [ttk.StringVar(),"111"],
    [ttk.StringVar(),"222"],
    [ttk.StringVar(),"333"],
    [ttk.StringVar(),"666"]
]
ttk.Checkbutton(root, text="111", variable=variable_content[0][0]).pack(side=ttk.LEFT, padx=5)
ttk.Checkbutton(root, text="222", variable=variable_content[1][0], boot).pack(side=ttk.LEFT, padx=5)
ttk.Checkbutton(root, text="333", variable=variable_content[2][0], boot).pack(side=ttk.LEFT, padx=5)
ttk.Checkbutton(root, text="666", variable=variable_content[3][0]).pack(side=ttk.LEFT, padx=5)
def ensure():
    print([v for i, v in variable_content if i.get()])
ttk.Button(text="确定",command=ensure).pack(side=ttk.LEFT, padx=5)
root.mainloop()
Nach dem Login kopieren

水scaler

#🎜 🎜## 🎜🎜#
import ttkbootstrap as ttk
from ttkbootstrap.constants import *
root = ttk.Window()
cbo = ttk.Combobox(
            master=root,
            bootstyle = DANGER,
            font = ("微软雅黑",12),
            values=[&#39;content 1&#39;, &#39;content 2&#39;, &#39;content 3&#39;],
        )
cbo.current(1) #首先展示values里面索引的对应的值
cbo.pack()
# cbo.set(&#39;set other&#39;)
def ensure(event):
    print(cbo.get())
cbo.bind(&#39;<<ComboboxSelected>>&#39;, ensure)
root.mainloop()
Nach dem Login kopieren

ScrollbarWie erstelle ich mit ttkbootstrap eine schöne Schnittstelle für die Python-GUI?

import ttkbootstrap as ttk
from ttkbootstrap.constants import *
root = ttk.Window()
f = ttk.Frame(bootstyle=SUCCESS)
f.place(x=10,y=10,width=600,height=200)

lf = ttk.Labelframe(text="提示",bootstyle=PRIMARY,width=100,height=60)
lf.place(x=10,y=210,width=300,height=100)
ttk.Label(lf,text="标签").pack()
ttk.Button(lf,text="按钮").pack()
root.mainloop()
Nach dem Login kopieren

Nachrichtenaufforderung 🎜#

import psutil,time,threading
import ttkbootstrap as ttk
from ttkbootstrap.constants import *
root = ttk.Window()
ttk.Meter(
        master=root,
        bootstyle=DEFAULT,
        metertype="full",#将仪表显示为一个完整的圆形或半圆形(semi)
        wedgesize=5, #设置弧周围的指示器楔形长度,如果大于 0,则此楔形设置为以当前仪表值为中心的指示器
        amounttotal=50, #仪表的最大值,默认100
        amountused=10, #仪表的当前值
        metersize=200,#仪表大小
        showtext=True, #指示是否在仪表上显示左、中、右文本标签
        interactive=True, #是否可以手动调节数字的大小
        textleft=&#39;左边&#39;, #插入到中心文本左侧的短字符串
        textright=&#39;右边&#39;,
        textfont="-size 30", #中间数字大小
        subtext="文本",
        subtextstyle=DEFAULT,
        subtextfont="-size 20",#文本大小
        ).pack(side=ttk.LEFT, padx=5)
def _():
        meter = ttk.Meter(
                metersize=180,
                padding=50,
                amountused=0,
                metertype="semi",
                subtext="当前网速(kB/s)",
                subtext,
                interactive=False,
                bootstyle=&#39;primary&#39;,
                )
        meter.pack(side=ttk.LEFT, padx=5)
        while True:
                meter.configure(amountused=round(getNet(),2))
def getNet():
    recv_before = psutil.net_io_counters().bytes_recv
    time.sleep(1)
    recv_now = psutil.net_io_counters().bytes_recv
    recv = (recv_now - recv_before)/1024
    return recv

t = threading.Thread(target=_)
t.setDaemon(True)
t.start()
root.mainloop()
Nach dem Login kopieren
Wie erstelle ich mit ttkbootstrap eine schöne Schnittstelle für die Python-GUI?Abfragefeld

import time,threading
import ttkbootstrap as ttk
from ttkbootstrap.constants import *
root = ttk.Window(size=(500,380))
def _():
    f = ttk.Frame(root).pack(fill=BOTH, expand=YES)
    p1 = ttk.Progressbar(f, bootstyle=PRIMARY)
    p1.place(x=20, y=20, width=380, height=40)
    p1.start() #间隔默认为50毫秒(20步/秒)
    p2 = ttk.Progressbar(f, bootstyle=INFO,orient=VERTICAL)
    p2.place(x=200, y=100, width=40, height=200)
    p2.step(10) #步长
    while True:
        for i in range(0,50,5):
            p2.step(i) #以步长i增长
            # p2.stop()#停止
            time.sleep(1)
t = threading.Thread(target=_)
t.setDaemon(True)
t.start()
root.mainloop()
Nach dem Login kopieren
Wie erstelle ich mit ttkbootstrap eine schöne Schnittstelle für die Python-GUI?subwindow

import threading,time
import ttkbootstrap as ttk
from ttkbootstrap.constants import *
root = ttk.Window()
ttk.Scale(
    master=root,
    orient=HORIZONTAL,
    value=75,
    from_=0,
    to=100
).pack(fill=X, pady=5, expand=YES)
ttk.Scale(master=root,orient=HORIZONTAL,bootstyle=WARNING,value=75,from_=100,to=0).pack(fill=X, pady=5, expand=YES)
def scale():
    s2 = ttk.Scale(
        master=root,
        bootstyle=SUCCESS,
        orient=VERTICAL,
        value=0,
        from_=100,
        to=0
    )
    s2.pack(fill=X, pady=5, expand=YES)
    for i in range(101):
        s2.configure(value=i)
        time.sleep(0.1)
        # print(s2.get())
t = threading.Thread(target=scale)
t.setDaemon(True)
t.start()
root.mainloop()
Nach dem Login kopieren
#🎜 🎜 #Menü Wie erstelle ich mit ttkbootstrap eine schöne Schnittstelle für die Python-GUI?

Neu hinzugefügt, ich hatte vorher immer das Gefühl, dass etwas fehlte, aber heute ist es mir erst wieder eingefallen, hahaha! ! !

Wie erstelle ich mit ttkbootstrap eine schöne Schnittstelle für die Python-GUI?

import ttkbootstrap as ttk
from ttkbootstrap.constants import *
root = ttk.Window()
fg1 = ttk.Floodgauge(
    master=None,
    cursor=None,
    font=None,
    length=None,
    maximum=100,
    mode=DETERMINATE,
    orient=HORIZONTAL,
    bootstyle=PRIMARY,
    takefocus=False,
    text=None,
    value=0,
    mask=None,
)
fg1.pack(side=ttk.LEFT, padx=5)
fg1.start()
fg2 = ttk.Floodgauge(
    master=root,
    boot,
    font=("微软雅黑",12), #文本字体
    length=100,  #水尺长度
    maximum=10, #增加到10
    mode=INDETERMINATE, #来回不确定
    orient=VERTICAL, #放置垂直方向
    text="文本", #文本
)
fg2.pack(side=ttk.LEFT, padx=5)
fg2.start()
fg3 = ttk.Floodgauge(
    root,
    bootstyle=INFO,
    length=300,
    maximum=200,
    font=("微软雅黑", 18, &#39;bold&#39;),
    mask=&#39;loading...{}%&#39;,
)
fg3.pack(side=ttk.LEFT, padx=5)
fg3.start()
# fg3.stop()
# fg3.configure(mask=&#39;...{}%&#39;)
fg3.configure(value=25) #初始值
fg3.step(50) #将上面25该值增加50步
root.mainloop()
Nach dem Login kopieren

panel

Wie erstelle ich mit ttkbootstrap eine schöne Schnittstelle für die Python-GUI?

import ttkbootstrap as ttk
from ttkbootstrap.constants import *
root = ttk.Window(size=(500,200))
f = ttk.Frame(root).pack(fill=BOTH, expand=YES)
text_content = &#39;&#39;&#39;
The Zen of Python, by Tim Peters

Beautiful is better than ugly.
Explicit is better than implicit.
Simple is better than complex.
Complex is better than complicated.
Flat is better than nested.
Sparse is better than dense.
Readability counts.
Special cases aren&#39;t special enough to break the rules.
Although practicality beats purity.
Errors should never pass silently.
Unless explicitly silenced.
In the face of ambiguity, refuse the temptation to guess.
There should be one-- and preferably only one --obvious way to do it.
Although that way may not be obvious at first unless you&#39;re Dutch.
Now is better than never.
Although never is often better than *right* now.
If the implementation is hard to explain, it&#39;s a bad idea.
If the implementation is easy to explain, it may be a good idea.
Namespaces are one honking great idea -- let&#39;s do more of those!
&#39;&#39;&#39;
# t = ttk.Text(f)
# t.insert("0.0",text_content)
# t.place(x=10,y=10,width=480,height=200)
# sl_x = ttk.Scrollbar(t,orient=HORIZONTAL) #使滚动条水平放置
# #放到窗口的底部, 填充X轴竖直方向
# sl_x.pack(side=ttk.BOTTOM, fill=ttk.X)
# sl_y = ttk.Scrollbar(t,boot) #滚动条默认垂直放置
# #放到窗口的右侧, 填充Y轴竖直方向
# sl_y.pack(side=ttk.RIGHT, fill=ttk.Y)
# #两个控件相关联
# sl_x.config(command=t.xview)
# t.config(yscrollcommand=sl_x.set)
# sl_y.config(command=t.yview)
# t.config(yscrollcommand=sl_y.set)

##滚动文本框
from ttkbootstrap.scrolled import ScrolledText
st = ScrolledText(f, padding=5, height=10, autohide=True)
st.pack(fill=BOTH, expand=YES)
st.insert(END, text_content)

root.mainloop()
Nach dem Login kopieren

treeview

# 🎜 🎜#

import ttkbootstrap as ttk
from ttkbootstrap.constants import *
root = ttk.Window()
tv = ttk.Treeview(
        master=root,
        columns=[0, 1],
        show=HEADINGS,
        height=5
    )
table_data = [
    (1,&#39;one&#39;),
    (2, &#39;two&#39;),
    (3, &#39;three&#39;),
    (4, &#39;four&#39;),
    (5, &#39;five&#39;)
]
for row in table_data:
    tv.insert(&#39;&#39;, END, values=row)
# print(tv.get_children())#(&#39;I001&#39;, &#39;I002&#39;, &#39;I003&#39;, &#39;I004&#39;, &#39;I005&#39;)
tv.selection_set(&#39;I002&#39;)
tv.heading(0, text=&#39;ID&#39;)
tv.heading(1, text=&#39;NAME&#39;)
tv.column(0, width=60)
tv.column(1, width=300, anchor=CENTER)
tv.pack(side=LEFT, anchor=NE, fill=X)
root.mainloop()
Nach dem Login kopieren

加载gif动图

左边是官网上提供的方法,右边是一个自己定义的方法。

Wie erstelle ich mit ttkbootstrap eine schöne Schnittstelle für die Python-GUI?

from pathlib import Path
from itertools import cycle
import ttkbootstrap as ttk
from ttkbootstrap.constants import *
from PIL import Image, ImageTk, ImageSequence
class AnimatedGif(ttk.Frame):
    def __init__(self, master):
        super().__init__(master, width=400, height=300)

        # open the GIF and create a cycle iterator
        file_path = Path(__file__).parent / "guanwang.gif"
        with Image.open(file_path) as im:
            # create a sequence
            sequence = ImageSequence.Iterator(im)
            images = [ImageTk.PhotoImage(s) for s in sequence]
            self.image_cycle = cycle(images)

            # length of each frame
            self.framerate = im.info["duration"]

        self.img_container = ttk.Label(self, image=next(self.image_cycle))
        self.img_container.pack(fill="both", expand="yes")
        self.after(self.framerate, self.next_frame)

    def next_frame(self):
        """Update the image for each frame"""
        self.img_container.configure(image=next(self.image_cycle))
        self.after(self.framerate, self.next_frame)

def loadingGif(app):
    numIdx = 12  # gif的帧数
    file_path = Path(__file__).parent / "TestGif.gif"
    frames = [ttk.PhotoImage(file=file_path, format=&#39;gif -index %i&#39; % (i)) for i in range(numIdx)]
    def run(rate):
        frame = frames[rate]
        rate += 1
        gif_label.configure(image=frame)  # 显示当前帧的图片
        gif_label.after(100, run, rate % numIdx)  # 0.1秒(100毫秒)之后继续执行函数(run)
    gif_label = ttk.Label(app)
    gif_label.pack(side=LEFT,padx=20,fill=BOTH, expand=YES)
    run(0)
if __name__ == "__main__":
    app = ttk.Window("Animated GIF", themename="litera")
    gif = AnimatedGif(app)
    gif.pack(side=LEFT,padx=20,fill=BOTH, expand=YES)
    loadingGif(app)
    app.mainloop()
Nach dem Login kopieren

打开本地文件

import ttkbootstrap as ttk
from ttkbootstrap.constants import *
from tkinter.filedialog import askopenfilename
root = ttk.Window()
def open_file():
    path = askopenfilename()
    # print(path)
    if not path:
        return
ttk.Button(root, text="打开文件", command=open_file).pack(fill=X, padx=10, pady=10)
root.mainloop()
Nach dem Login kopieren

打开浏览器

import ttkbootstrap as ttk
from ttkbootstrap.constants import *
import webbrowser
root = ttk.Window()
def open_url(event):
    webbrowser.open("http://www.baidu.com", new=0)  # 启动web浏览器访问给定的URL
label = ttk.Label(root,text="https://www.baidu.com/",bootstyle=PRIMARY)
label.pack(fill=BOTH)
label.bind("<Button-1>", open_url)
root.mainloop()
Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonWie erstelle ich mit ttkbootstrap eine schöne Schnittstelle für die Python-GUI?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:yisu.com
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage