Bagaimana cara mengubah gambar latar belakang dengan python?

Saya suka membuat aplikasi Streamlit di waktu senggang, baik untuk tujuan belajar maupun untuk bersenang-senang. Streamlit, kerangka kerja all-python yang sedang tren, memungkinkan ilmuwan data seperti saya, pemrogram, atau siapa pun yang tahu cara membuat kode dengan python, dengan cepat dan mudah membangun pembelajaran mesin dan aplikasi data yang indah. Anda tidak perlu memiliki pengalaman pengembangan web front-end untuk membuat aplikasi web menggunakan Streamlit. Jika Anda cukup mahir dengan python, Anda semua baik-baik saja

Di pos hari ini, saya ingin menunjukkan cara menambahkan gambar latar belakang ke aplikasi Streamlit— baik dari URL atau dari komputer lokal Anda. Kami akan menggunakan 'Aplikasi Pembelajaran Bahasa' di artikel berikut untuk tujuan demonstrasi dan melihat cara menambahkan gambar latar ke dalamnya. Jika Anda telah membuat aplikasi, Anda cukup memasukkan cuplikan kode di pos hari ini ke file python aplikasi Anda dan menambahkan gambar latar belakang ke aplikasi Anda secara instan

Buat Aplikasi Pembelajaran Bahasa Sederhana Menggunakan Streamlit

Cara Membuat Aplikasi Pembelajaran dan Terjemahan Bahasa Anda Sendiri menggunakan Streamlit dan Googletrans

menuju ilmu data. com

Gambar oleh Pengarang (gambar latar belakang oleh Pixabay)

Untuk menambahkan gambar latar belakang ke aplikasi Streamlit, Anda harus menggunakan st.markdown() dengan CSS. Baiklah, saya tahu saya katakan sebelumnya bahwa Anda tidak perlu memiliki pengalaman pengembangan web front-end untuk membangun aplikasi Streamlit. Dalam kasus penggunaan ini, kita perlu menerapkan sedikit pengetahuan HTML/CSS untuk menyelesaikan pekerjaan

Jadi apa itu CSS? . Dengan CSS, Anda dapat menentukan berbagai gaya halaman web seperti warna, font, ukuran teks, bagaimana berbagai elemen HTML ditata, gambar latar apa yang akan digunakan, dll.

For example, we can specify the background image in the <style> element with the CSS background-image property. This HTML element is marked by an opening tag . The code would look like something below:

<style>
p {
background-image: url(‘img_file.jpg’);
}
</style>

Kami kemudian menempatkan elemen HTML sebagai string di dalam st.markdown(body, unsafe_allow_html=False). Secara default, semua tag HTML yang ditemukan di body akan di-escape dan karenanya diperlakukan sebagai teks murni. Namun, kita dapat mematikan perilaku ini dengan menyetel argumen unsafe_allow_html menjadi False. Jadi kodenya akan terlihat seperti ini

st.markdown(   f”””   <style>
p {
background-image: url(‘img_file.jpg’);
}
</style>
”””, unsafe_allow_html=True)
_

Oke. Saya harap Anda sekarang mengerti apa itu CSS dan cuplikan kode dasar yang dapat digunakan untuk menentukan gambar latar belakang pada elemen HTML menggunakan st.markdown(). Mari kita lihat bagaimana kita dapat menggunakan CSS untuk menyisipkan gambar latar belakang ke dalam aplikasi Streamlit 'Pembelajaran Bahasa'

Pilihan 1. Tambahkan Gambar Latar Belakang dari URL

Menambahkan gambar latar belakang dari URL cukup mudah. Pertama mari kita tentukan fungsi yang disebut

st.markdown(   f”””   <style>
p {
background-image: url(‘img_file.jpg’);
}
</style>
”””, unsafe_allow_html=True)
0 untuk menentukan gambar latar belakang di elemen
st.markdown(   f”””   <style>
p {
background-image: url(‘img_file.jpg’);
}
</style>
”””, unsafe_allow_html=True)
1 di dalam st.markdown(). Kemudian kita cukup memanggil fungsi
st.markdown(   f”””   <style>
p {
background-image: url(‘img_file.jpg’);
}
</style>
”””, unsafe_allow_html=True)
_0 untuk menambahkan gambar latar belakang ke Aplikasi 'Pembelajaran Bahasa'

Perhatikan bahwa kami juga menyetel properti

st.markdown(   f”””   <style>
p {
background-image: url(‘img_file.jpg’);
}
</style>
”””, unsafe_allow_html=True)
_4 ke
st.markdown(   f”””   <style>
p {
background-image: url(‘img_file.jpg’);
}
</style>
”””, unsafe_allow_html=True)
5. Dengan cara ini, gambar latar belakang akan menutupi seluruh elemen. Kita juga menyetel properti
st.markdown(   f”””   <style>
p {
background-image: url(‘img_file.jpg’);
}
</style>
”””, unsafe_allow_html=True)
6 ke
st.markdown(   f”””   <style>
p {
background-image: url(‘img_file.jpg’);
}
</style>
”””, unsafe_allow_html=True)
7 sehingga seluruh elemen selalu tertutup, tanpa peregangan — artinya gambar akan mempertahankan proporsi aslinya

pilihan 2. Tambahkan Gambar Latar Belakang dari Komputer Anda

Menambahkan gambar latar belakang dari komputer lokal Anda sedikit rumit. Pertama, Anda perlu menempatkan file gambar Anda di folder yang sama dengan file python aplikasi Anda. Selanjutnya, Anda perlu mengonversi file gambar menjadi string

st.markdown(   f”””   <style>
p {
background-image: url(‘img_file.jpg’);
}
</style>
”””, unsafe_allow_html=True)
8 dengan menggunakan
st.markdown(   f”””   <style>
p {
background-image: url(‘img_file.jpg’);
}
</style>
”””, unsafe_allow_html=True)
9 (baris 3–4). Setelah itu, Anda menggunakan st.markdown()_0 untuk mendekode st.markdown()1 untuk digunakan dalam elemen HTML (baris 7) dan meletakkan semuanya di dalam properti background-image

Kode di bawah ini berfungsi untuk jenis file gambar lain seperti JPG atau GIF juga. Cukup mengubah 'png' menjadi 'jpg' atau 'gif' di baris 9 sudah cukup. Cobalah

Gambar oleh Pengarang (gambar latar belakang oleh Pixabay)

Ini dia. Kami telah berhasil menambahkan gambar latar belakang ke aplikasi Streamlit 'Language Leaning'. Terima kasih sudah membaca. Saya harap Anda menikmati postingan singkat tentang Streamlit ini dan mempelajari sesuatu yang baru hari ini. Untuk mempelajari lebih lanjut tentang Streamlit, silakan lihat blog Medium saya untuk daftar lengkap semua jenis contoh aplikasi Streamlit

Anda dapat membuka akses penuh ke tulisan saya dan media lainnya dengan mendaftar untuk keanggotaan Medium ($5 per bulan) melalui tautan rujukan ini. Dengan mendaftar melalui tautan ini, saya akan menerima sebagian dari biaya keanggotaan Anda tanpa biaya tambahan untuk Anda. Terima kasih

Bagaimana cara mengubah latar belakang gambar saya?

Cara Mengubah Latar Belakang Gambar .
Unduh editor foto
Tandai objek latar depan
Hapus latar belakang
Tambahkan gambar latar belakang baru

Bagaimana cara mengubah latar belakang gambar menjadi putih dengan Python?

Dengan Python/OpenCV, konversi ke HSV. Dapatkan nilai HSV di pojok kiri atas. Lakukan ambang batas inRange() pada gambar HSV untuk membuat topeng. Gunakan mask untuk mengubah warna gambar asli menjadi putih dimana mask berwarna putih .

Bagaimana cara mengubah gambar latar belakang di Pycharm?

Gambar latar belakang .
Tekan Ctrl+Alt+S untuk membuka pengaturan IDE dan pilih Penampilan & Perilaku. Penampilan
Klik tombol Gambar Latar Belakang. tip. .
Dalam dialog Gambar Latar Belakang, tentukan gambar yang ingin Anda gunakan sebagai latar belakang dan klik OK untuk menerapkan perubahan

Bagaimana cara menghapus latar belakang putih dari gambar dengan Python?

OpenCV adalah pustaka pemrosesan gambar untuk python. .
Langkah 1 – Impor paket yang diperlukan. .
Langkah 2 – Inisialisasi objek selfie-segmentasi. .
Langkah 3 – Baca frame dari webcam. .
Langkah 4 – Buat topeng tersegmentasi. .
Langkah 5 – Ganti latar belakang dengan gambar