QuykHtml
1.0.0
Pustaka python yang memungkinkan Anda membuat templat HTML dengan cepat dan mudah dan bahkan membuat situs web lengkap.
Jika Anda merasa bermurah hati atau ingin membelikan saya kopi atau menyumbang, di bawah ini adalah aplikasi tunai saya:
cash app: $elmling
Fitur Baru:
- Cepat
Fitur Utama:
- Labu
- Merangkai perintah bersama
- Dukungan Javascript/jQuery
- Pembuatan Tabel
- Penciptaan Ajax
- Pembuatan Formulir
- Penguat
- seo
- Contoh Halaman Arahan
# Impor kelas dari perpustakaandari QuykHtml import qhtml# Buat instance kelasq = qhtml()# Masukkan elemen p yang telah dimodifikasi ke dalam display utama kitaq.display.insert(q.new('p').set_text('Hello World').set_id ('text-id').style.set('font-size:24px;'))# Render halamanq.display.render() dari QuykHtml impor qhtml# Buat instance classq = qhtml()# Buat divdiv = q.new("div")# Buat paragrafp = q.new("p")# Buat inputinput = q.new("input") # Render hasilnya dengan memasukkan semua objek ke displayq.display.insert([div, p, input]).render() dari QuykHtml impor qhtml# Buat instance classq = qhtml()# Deklarasikan css, memungkinkan daftar daftar, dengan nilai pertama adalah# nama kelas dan string markup/gaya untuk nilai keduaq.css.add([["div", "font-size:32px;"],[".div_custom","color:gray;"]])# Anda juga dapat melakukan hal yang sama hanya dengan memanggil metode add dengan dua argumentq.css.add("div","font-size:32px;")q.css.add(".div_custom","color:gray;")# Buat div dengan kelas .div_custom dan atur teksnya di divdiv = q.new("div").set_class("div_custom").set_text("QuykHtml Rocks!")# Anda dapat menggunakan gaya inline untuk menata elemen dan menyetel teks dalam divdiv2 = q.new("div").style.set("ukuran font:48px;warna:hijau;").set_text("QuykHtml Rocks!")# Render hasilnyaq.display.insert( [div, div2]).render() dari QuykHtml import qhtml# Buat instance classq = qhtml()p = q.new("p")# Global Element Settersp.style.set('color:red;')p.style.append('background-color: yellow; ')p.add_attribute('title="Qhytml adalah mudah!"')p.set_text('text')p.set_text_ipsum()p.set_text_ipsum_large()p.set_text_ipsum_small()p.set_class('class1 class2')p.set_form_button()p.set_id('my-id ')p.set_name('some-name')p.set_value('custom value')p.set_tool_tip('alat teks hover sederhana tip')p.on_click("alert('saya diklik!');")p.on_click_goto('google.com')p.on_right_click("alert('saya diklik kanan!');")p. on_mouse_enter("alert('Mouse masuk!');")p.on_mouse_leave("alert('Mouse kiri!');")html = p.html()# Elemen Tertentu settersq.baru("img").set_img_src('src_url')q.baru("img").set_img_placeholder(400)q.baru("img").on_click_showPreview()q.baru("form").set_form_ options('file.php','get')q.new("button").set_form_button()q.new("iframe").set_iframe('google.com')q.new("input"). set_auto_complete(Salah) dari QuykHtml import qhtml# Buat instance classq = qhtml()# 'Impor' bootstrap dengan mudahq.bootstrap.use(True)# Buat tabel mentah 1 baris dan 2 kolomtable = q.table(1,2)# Metode sisipkan menggunakan berbasis 0 indeks -> insert_at(baris,kolom,qhtml_objek atau daftar qhtml_objects)table.insert_at(0,0,q.new("p").set_text("Baris 1 kolom 1"))table.insert_at(0,1,q.new("p").set_text("Baris 1 kolom 2"))# Tabel sintaks juga valid = q.table(1,2).insert_at(0,0,q.new("p").set_text("Baris 1 kolom 1")).insert_at(0,1,q.new("p").set_text("Baris 1 kolom 2"))# Contoh manipulasi Td untuk i dalam rentang(2):
table.style_td_at(0,i,'text-align:center') table.set_td_class_at(0,i,'some-class') table.set_td_id_at(0,i,'some-id' + str(i))# Pastikan untuk membuat tabel # yang mengembalikan div dengan kode tabel di ittable = table.build()# Render resultq.display.insert(table).render() from QuykHtml import qhtml# Membuat instance classq = qhtml()# dengan mudah 'mengimpor' bootstrap utilitasq.bootstrap.use(True)# Menambahkan skrip, bahkan dapat dibaca dari fileq.scripts.append( 'function js_function() {'' alert("Fungsi JS");''}')# Menambahkan skrip ke objek qhtmlp = q.new("p").set_text("Teks elemen").scripts_add( 'function js_function() {'' alert("A JS Function");''}')# Tambahkan kode yang akan dieksekusi saat memuat halaman ke objek qhtmlp = q.new("p") .set_text("Elemen teks").scripts_add('alert("Kode Js dijalankan saat memuat halaman");', on_page_load=True)q.display.insert(p).render() from QuykHtml import qhtml# Buat instance classq = qhtml()# 'Impor' bootstrap utilitasq.bootstrap.use(True) dengan mudah# Buat permintaan ajax pada elemen p# Selalu tentukan r dalam fungsi panggilan balik karena itulah responsnya textp = q .baru("p").ajax_build('get','file.php?args=1&args2=2","_some_call_back_func(r)')# Tentukan fungsi dengan cepat jika perlu bep.scripts_add('function _some_call_back_func(r){alert("Response text " + r.responseText);}')# Tambahkan Kode JS agar saat halaman dimuat, panggil fungsi ajax menggunakan# elemen. ajax_get("pointer") <- 'metode ajax yang dibuat oleh ajax_build'p.scripts_add(p.ajax_get("pointer"),on_page_load=True)q.display.insert(p).render() dari QuykHtml impor qhtml# Buat instance classq = qhtml()# 'impor' utilitas bootstrap dengan mudahq.bootstrap.use(True)# Buat form elementform = q.new("form").set_form_options('file.php','post' )# Buat elemen input dan atur namanya menjadi form_nameinput = q.new("input").set_name('form_name')# Buat tombol dan gunakan metode .set_form_button() untuk # mengirimkan formulir ketika diklikbutton = q.new("button").set_text("submit").set_form_button()# Masukkan elemen formulir ke dalam formform.insert([input,button ])q.display.insert(form).render() Gunakan bahasa markup resmi dengan mudah (menggunakan bootstrap)
untuk mendefinisikan objek qhtml dengan cepat dan mudah.
- use attr-'attributename' to declare normal html element attributes - use 'attributename' to attempt to use ANY Qhtml setter methods on an element - you declare columns by element position in the list - each list item is essentially a row - requires bootstrap (instantiate with qhtml method)
# Membuat instance classq = qhtml()# dengan mudah 'mengimpor' utilitas bootstrapq.bootstrap.use(True)# metode ekspres mengembalikan# qhtml objectlayout aktual = q.express([
['div','p','div']
]).style.set('warna latar:#45afed;')q.display.insert(layout).render() # Membuat instance classq = qhtml()# dengan mudah 'mengimpor' utilitas bootstrapq.bootstrap.use(True)# metode ekspres mengembalikan# qhtml objectlayout aktual = q.express([
['div attr-class="kelas saya"','p attr-id="myid"','div attr-style="background-color:red"']
]).style.set('warna latar:#45afed;')q.display.insert(layout).render() # Buat instance classq = qhtml()# 'impor' bootstrap dengan mudahq.bootstrap.use(True)# objek Qhtml memiliki metode yang disebut: set_text# dan juga metode yang disebut: set_img_src# jadi kami menghilangkan awalan 'set_'. Jadi, alih-alih# set_text("some text"), kita cukup menggunakan text="some text"# untuk memanggil methodlayout = q.express([
['div','p text="QuykHtml Batu!"','div'],
['div','img img_src="myimagesource.com" attr-class="myImgClass"','div']
]).style.set('warna latar:#45afed;')q.display.insert(layout).render() # Buat instance classq = qhtml()# 'Impor' bootstrap utilitasq.bootstrap.use(True)(True) dengan mudah# Definisikan beberapa cssq.css.add('.center','text-align:center;')# Buat elemen formulir kamilayout = q.ekspres([
['div', 'p text="Email"', 'div'],
['div', 'masukan', 'div'],
['div', 'p text="Kata Sandi"', 'div'],
['div', 'masukan', 'div'],
['div', 'p text="Konfirmasi"', 'div'],
['div', 'masukan', 'div'],
['div', 'button text="Lengkap" attr-value="kirim" attr-class="margin-top-med signup"', 'div']
]).set_class("center", True)# Buat wadah formulir sebenarnya elementform = q.new('form').set_class('center')# Masukkan elemen formulir dan atur formulir optionsform.insert(layout). set_form_options("register.php", "post")# Render hasilnyaq.display.insert(form) dari QuykHtml impor qhtml# Buat instance classq = qhtml()# Tentukan beberapa SEOq.seo.set_page_title('Judul Halaman')q.seo.set_page_author('Penulis')q.seo.set_page_keywords('beberapa kata kunci')q.seo .set_page_encoding('UTF-8')q.seo.set_page_auto_refresh(30) # segarkan setiap 30 detiklist_of_seo = q.seo.display_all_seo() dari QuykHtml impor qhtml# Buat instance classq = qhtml()# Perintah rangkaianq.new("p").set_text('some text').set_class('text-class').set_id('text-id').on_click( "alert('klik saya');").style.set("cursor:pointer;")# Render contoh argumen# output_file str_path, only_html boolean, set_clip_board booleanq.display.insert(q.new("p.").set_text("Render Arguments")).render(output_file="file/path/file.html")q.display.insert(q.new(" p.").set_text("Render Argumen")).render(only_html=True)q.display.insert(q.new("p.").set_text("Render Argumen")).render(output_file="file/path/file.html",set_clip_board=True)q.display.insert(q.new("p.").set_text("Render Argumen")).render( only_html=Benar,set_clip_board=Benar)q.display.insert(q.new("p.").set_text("Argumen Render")).render()# ------------------------------# Bootstrap - Dukungan# --------------- ---------------q.bootstrap.use(True)div = q.new("div").set_class("row")div_col1 = q.new("div") .set_class("col").set_text("column1")div_col2 = q.new("div").set_class("col").set_text("column2")div.insert([div_col1,div_col2])# Sintaks yang juga validdiv = q.new("div").set_class("row ").masukkan([ q.baru("div").set_class("col").set_text("kolom1"), q.baru("div").set_class("col").set_text("kolom2")
])# ------------------------------# Tambahkan ke tag kepalaq.head.append('<script type=" teks/javascript" src="path/to/js_code.js"></script>')q.head.append('<link rel="stylesheet" href="path/to/css.css">') # Pembantu warna bawaanc = q.css.colorscolors = [c.LIGHT_GRAY, c.DARK_GRAY,c.LIGHT_GREEN,c.DARK_GREEN] # dan banyak lagi..untuk warna dalam warna: print(color) # - > #hex_value# Ulangi setiap objek yang dibuat dari elemen instance qhtml di q. semua: print('Jenis elemen - > ' + elemen.tipe) elemen.set_teks("Timpa")
# Menduplikasi elemen objekp_main = q.new("p").style.set("ukuran font:32px;")p1 = q.dupe(p_main).set_text('p tag nomor 1').style.append( 'color:red;')p2 = q.dupe(p_main).set_text('p tag number 2').style.append('color:green;')# Mengekspor gaya css ditambahkan ke 'q.css'q.css.add('p','font-size:32px;')q.css.add('div','text-align:center;')q.css.export(' jalur/ke/ekspor.css') dari QuykHtml impor qhtmlq = qhtml()q.bootstrap.use(True)head = q.new('div')head_text = q.new('p')head_text.set_text('Contoh Pendaratan Header').style.align('center').style.font_size('64px;').style.append('padding-top:200px;padding-bottom:200px;background-color:gray;color:white; ')head.insert(head_text)body = q.new('div').style.set('width:65%;margin:auto;margin-bottom:100px;').set_class('row')body_text = q.baru('p').set_text_ipsum_large().style.font_size('24px').style.align('left').style.append('margin-top:60px;margin-bottom:60px;') .style.font_color('abu-abu')body_img_1 = q.baru('img').set_class('col').set_img_placeholder(400).style.height('400px').style.append('margin-top:20px;')body_img_2 = q.dupe(body_img_1 )body.insert([body_text,body_img_1,body_img_2])footer = q.new('div').style.align('center').style.set('margin:0px;position:fixed;bottom:0px;width:100%;warna latar:abu-abu;padding-atas: 5px;padding-bawah:5px;')footer_text = q.new('p').style.set('font-weight:bold;margin:0px;')footer_text.set_text('Contoh Teks Footer. Baiklah Dilindungi Undang-undang.').style.align('center').style.font_size('15px').style.font_color('white')footer.insert(footer_text)q.display.insert([head,body, catatan kaki]).render() # Aplikasi Flask Hello World yang sangat sederhana untuk Anda mulai...dari QuykHtml import qhtmlfrom flask import Flaskq = qhtml()q.bootstrap.use(True)app = Flask(__name__)# selalu gunakan " " sebagai bagian luar string quote dan ' ' di dalam if needon_click_code = "alert('Anda mengklik tombol!');"# Div berisi elemen p dan tombol dengan event di klik div = q.new('div').style.set('text-align:center;').insert([q.new("p").style.font_size('42px').set_text("Ini berhasil" ),q.baru('tombol').style.font_size('24px').set_text('klik saya').on_click(on_click_code)
])# Div berisi elemen p dengan teks Ucapan di dalamnyadiv2 = q.new('div').style.set('background-color:gray;text-align:center;').insert([q.new(' p').style.set('ukuran font:32px;warna:putih;berat font:bold;').set_text('Halo dari QuykHtml dan Flask!')
])@app.route('/')def hello_world(): # Gunakan metode .html pada objek qhtml untuk mendapatkan HTML-nya dan menyajikannyareturn div.html() + div2.html() # Aplikasi Flask Hello World yang sangat sederhana untuk Anda mulai...dari QuykHtml import qhtmlfrom flask import Flaskq = qhtml()q.bootstrap.use(True)app = Flask(__name__)# selalu gunakan " " sebagai bagian luar string quote dan ' ' di dalam if needon_click_code = "alert('Anda mengklik tombol!');"# Div berisi elemen p dan tombol dengan event di klik div = q.new('div').style.set('text-align:center;').insert([q.new("p").style.font_size('42px').set_text("Ini berhasil" ),q.baru('tombol').style.font_size('24px').set_text('klik saya').on_click(on_click_code)
])# Div berisi elemen p dengan teks Ucapan di dalamnyadiv2 = q.new('div').style.set('background-color:gray;text-align:center;').insert([q.new(' p').style.set('ukuran font:32px;warna:putih;berat font:bold;').set_text('Halo dari QuykHtml dan Flask!')
])# Tempatkan objek di layar dan render file ke test.txtq.display.insert([div,div2]).render(output_file='test.txt', only_html=True)@app.route('/ ')def hello_world(): # Gunakan metode file_read untuk mendapatkan HTML yang dirender dan sajikanhtml = q.file_read('test.txt')return html 
