generate qr code svg (#2815)

* generate qr code svg prototype * qr code for groups fix formatting * - letter avatar in qrcode - escape xml in userinput (display/groupname) - fix "Me" display name - merge import declarations * remove dot at the end of VerifyContactQRDescription * if addr == displayname, show only one of them Especially useful for yggmail accounts without usernames, because the text would overflow otherwise. * use real clipPath for rounded avatar * - center avatar text better (dominant-baseline) - add "sans-serif" to font fallback for text if arial is missing * make corner always blue * add [logo + "get.delta.chat"] footer to qrcode * Update deltachat-ffi/deltachat.h Co-authored-by: bjoern <r10s@b44t.com> * Apply suggestions from code review Co-authored-by: bjoern <r10s@b44t.com> * new card design - add stockstrings - update changelog * make qrcode pixels also #f2f2f2 instead of full white * rename VERIFY_CONTACT_QR_DESC to SETUP_CONTACT make footer text a tiny bit darker upon r10s's request * avoid using which is a doxygen command * point out that one will join a group (this is still shorted and was also suggested in recent chats) * add option to generate qr-code-svg to repl tool * use same font-family in text and footer * thinner card border * remove superfluous <tspan> from footer to make color tweaking easier * move font-weight to style, ios renderer does not pick it up from attribute; remove default font attributes not used consequently * make get.delta.chat more visible * align properly using dominant-baseline=central and alignment-baseline=middle, this makes things nice on all systems but android (before, ios was wrong and all others not 100% aligned as font metrics are ignored) (android needs a subsequent improvement) Co-authored-by: bjoern <r10s@b44t.com>
2026-04-27 10:26:29 +03:00 · 2021-11-24 23:23:01 +01:00
parent cc78347293
commit 416bf3a829
12 changed files with 427 additions and 3 deletions
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,11 @@
 # Changelog

+## Unreleased
+
+### API changes
+- `dc_get_securejoin_qr_svg(chat_id)` added #2815
+- added stock-strings `DC_STR_SETUP_CONTACT_QR_DESC` and `DC_STR_SECURE_JOIN_GROUP_QR_DESC`
+
 ## 1.66.0

 ### API changes
--- a/Cargo.lock
+++ b/Cargo.lock
@@ -706,7 +706,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "37e58ac78573c40708d45522f0d80fa2f01cc4f9b4e2bf749807255454312002"
 dependencies = [
 "bitflags",
- "textwrap",
+ "textwrap 0.11.0",
 "unicode-width",
 ]

@@ -1098,6 +1098,7 @@ dependencies = [
 "pgp",
 "pretty_env_logger",
 "proptest",
+ "qrcodegen",
 "quick-xml",
 "r2d2",
 "r2d2_sqlite",
@@ -1116,7 +1117,9 @@ dependencies = [
 "strum",
 "strum_macros",
 "surf",
+ "tagger",
 "tempfile",
+ "textwrap 0.14.2",
 "thiserror",
 "toml",
 "url",
@@ -2758,6 +2761,12 @@ dependencies = [
 "regex-syntax",
 ]

+[[package]]
+name = "qrcodegen"
+version = "1.7.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "135e6754eed8ca897dd70584d895e72e36860b3e163b6bcedce48571cbaef343"
+
 [[package]]
 name = "quick-error"
 version = "1.2.3"
@@ -3381,6 +3390,12 @@ version = "1.7.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "1ecab6c735a6bb4139c0caafd0cc3635748bbb3acf4550e8138122099251f309"

+[[package]]
+name = "smawk"
+version = "0.3.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "f67ad224767faa3c7d8b6d91985b78e70a1324408abcb1cfcc2be4c06bc06043"
+
 [[package]]
 name = "socket2"
 version = "0.3.19"
@@ -3582,6 +3597,12 @@ dependencies = [
 "unicode-xid",
 ]

+[[package]]
+name = "tagger"
+version = "3.2.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "c933e626196d509b053f49573e35ad237c0ff6a36c23c1aa61ffeab49251d24f"
+
 [[package]]
 name = "tap"
 version = "1.0.1"
@@ -3620,6 +3641,17 @@ dependencies = [
 "unicode-width",
 ]

+[[package]]
+name = "textwrap"
+version = "0.14.2"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "0066c8d12af8b5acd21e00547c3797fde4e8677254a7ee429176ccebbe93dd80"
+dependencies = [
+ "smawk",
+ "unicode-linebreak",
+ "unicode-width",
+]
+
 [[package]]
 name = "thiserror"
 version = "1.0.30"
@@ -3817,6 +3849,15 @@ version = "0.3.7"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "1a01404663e3db436ed2746d9fefef640d868edae3cceb81c3b8d5732fda678f"

+[[package]]
+name = "unicode-linebreak"
+version = "0.1.2"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "3a52dcaab0c48d931f7cc8ef826fa51690a08e1ea55117ef26f89864f532383f"
+dependencies = [
+ "regex",
+]
+
 [[package]]
 name = "unicode-normalization"
 version = "0.1.19"
--- a/Cargo.toml
+++ b/Cargo.toml
@@ -73,6 +73,9 @@ url = "2"
 uuid = { version = "0.8", features = ["serde", "v4"] }
 fast-socks5 = "0.4"
 humansize = "1"
+qrcodegen = "1.7.0"
+tagger = "3.2.1"
+textwrap = "0.14.2"

 [dev-dependencies]
 ansi_term = "0.12.0"
--- a/assets/qrcode_logo_footer.svg
+++ b/assets/qrcode_logo_footer.svg
@@ -0,0 +1,10 @@
+<text
+     xml:space="preserve"
+     style="font-weight:bold;font-size:24.4118px;line-height:1.25;font-family:sans-serif;fill:#aaaaaa;fill-opacity:1;stroke:none;stroke-width:0.915439"
+     x="42.325161"
+     y="23.32255"
+     id="text72398">get.delta.chat</text>
+  <path
+     id="path84310"
+     style="opacity:0.25;fill:#000000;fill-opacity:1;stroke:none;stroke-width:0.915439"
+     d="M 17.13769,0.00129321 C 7.6753075,0.11650893 0,7.8915283 0,17.362467 c 0,9.47094 7.6753075,17.059745 17.13769,16.944599 8.99669,-0.03598 6.880074,-5.025654 16.824785,-0.405885 -5.447648,-8.510047 0.184241,-9.642482 0.311117,-16.955289 0,-9.4709395 -7.673512,-17.0597453 -17.135895,-16.94459879 z M 17.0769,4.9986797 c 1.84214,0 3.447355,0.253959 4.815003,0.7616693 1.381603,0.5076411 2.072253,1.207862 2.072253,2.0990711 0,0.4286855 -0.167495,0.7836052 -0.50242,1.0656242 -0.334921,0.2819844 -0.724544,0.4237724 -1.171121,0.4237724 -0.641952,0 -1.396532,-0.3909376 -2.261778,-1.169353 C 19.14963,7.3898036 18.402555,6.83791 17.788507,6.5220182 17.188416,6.1950547 16.484552,6.0321266 15.675129,6.0321266 c -1.032717,0 -1.883352,0.1854523 -2.553215,0.5578447 -0.655913,0.372254 -0.98517,0.8460916 -0.98517,1.4214436 0,0.5414792 0.272815,1.0495355 0.817093,1.5233385 0.544275,0.4738026 1.946291,1.3367446 4.207097,2.5889976 2.414319,1.342419 4.117377,2.390985 5.108232,3.146807 1.004795,0.755857 1.821505,1.675853 2.449514,2.758846 0.628002,1.082993 0.942253,2.227607 0.942253,3.434674 0,2.120834 -0.929555,3.993314 -2.785656,5.617786 -1.84214,1.613228 -3.99694,2.41915 -6.467082,2.41915 -2.246845,0 -4.145607,-0.647976 -5.694677,-1.945312 -1.5490699,-1.297336 -2.3225722,-3.028063 -2.3225722,-5.194049 0,-2.087031 0.8506345,-3.83094 2.5532182,-5.229825 1.716541,-1.398884 3.824203,-2.245599 6.322256,-2.538897 -0.697774,-0.631749 -1.668763,-1.387225 -2.910816,-2.267155 -1.367648,-0.970199 -2.287914,-1.73045 -2.762402,-2.283243 -0.474491,-0.5640381 -0.711618,-1.1795944 -0.711618,-1.8451814 0,-0.9927581 0.572093,-1.7710351 1.716451,-2.3351077 1.144362,-0.5753173 2.636724,-0.8635642 4.478865,-0.8635642 z m 1.110327,10.3738083 c -4.005262,0.5302 -6.007576,2.75279 -6.007576,6.667322 0,2.01932 0.49495,3.587291 1.485805,4.704157 1.004806,1.116832 2.169696,1.675299 3.495479,1.675299 1.381602,0 2.520072,-0.535632 3.413229,-1.60738 0.893168,-1.082959 1.339187,-2.545264 1.339187,-4.384079 0,-2.662348 -1.242022,-5.013441 -3.726124,-7.055319 z" />
--- a/deltachat-ffi/deltachat.h
+++ b/deltachat-ffi/deltachat.h
@@ -2243,6 +2243,20 @@ dc_lot_t*       dc_check_qr                  (dc_context_t* context, const char*
 char*           dc_get_securejoin_qr         (dc_context_t* context, uint32_t chat_id);


+/**
+ * Get QR code image from the QR code text generated by dc_get_securejoin_qr().
+ * See dc_get_securejoin_qr() for details about the contained QR code.
+ *
+ * @memberof dc_context_t
+ * @param context The context object.
+ * @param chat_id group-chat-id for secure-join or 0 for setup-contact,
+ *     see dc_get_securejoin_qr() for details.
+ * @return SVG-Image with the QR code.
+ *     On errors, an empty string is returned.
+ *     The returned string must be released using dc_str_unref() after usage.
+ */
+char*           dc_get_securejoin_qr_svg         (dc_context_t* context, uint32_t chat_id);
+
 /**
 * Continue a Setup-Contact or Verified-Group-Invite protocol
 * started on another device with dc_get_securejoin_qr().
@@ -6077,6 +6091,20 @@ void dc_event_unref(dc_event_t* event);
 /// `%1$s` will be replaced by the name of the inviter.
 #define DC_STR_SECURE_JOIN_REPLIES        118

+/// "Scan to chat with %1$s"
+///
+/// Subtitle for verification qrcode svg image generated by the core.
+///
+/// `%1$s` will be replaced by name and address of the inviter.
+#define DC_STR_SETUP_CONTACT_QR_DESC      119
+
+/// "Scan to join %1$s"
+///
+/// Subtitle for group join qrcode svg image generated by the core.
+///
+/// `%1$s` will be replaced with the group name.
+#define DC_STR_SECURE_JOIN_GROUP_QR_DESC  120
+
 /**
 * @}
 */
--- a/deltachat-ffi/src/lib.rs
+++ b/deltachat-ffi/src/lib.rs
@@ -25,6 +25,7 @@ use std::time::{Duration, SystemTime};
 use anyhow::Context as _;
 use async_std::sync::RwLock;
 use async_std::task::{block_on, spawn};
+use deltachat::qr_code_generator::get_securejoin_qr_svg;
 use num_traits::{FromPrimitive, ToPrimitive};

 use deltachat::chat::{ChatId, ChatVisibility, MuteDuration, ProtectionStatus};
@@ -2075,6 +2076,27 @@ pub unsafe extern "C" fn dc_get_securejoin_qr(
        .strdup()
 }

+#[no_mangle]
+pub unsafe extern "C" fn dc_get_securejoin_qr_svg(
+    context: *mut dc_context_t,
+    chat_id: u32,
+) -> *mut libc::c_char {
+    if context.is_null() {
+        eprintln!("ignoring careless call to generate_verification_qr()");
+        return "".strdup();
+    }
+    let ctx = &*context;
+    let chat_id = if chat_id == 0 {
+        None
+    } else {
+        Some(ChatId::new(chat_id))
+    };
+
+    block_on(get_securejoin_qr_svg(ctx, chat_id))
+        .unwrap_or_else(|_| "".to_string())
+        .strdup()
+}
+
 #[no_mangle]
 pub unsafe extern "C" fn dc_join_securejoin(
    context: *mut dc_context_t,
--- a/examples/repl/cmdline.rs
+++ b/examples/repl/cmdline.rs
@@ -423,6 +423,7 @@ pub async fn cmdline(context: Context, line: &str, chat_id: &mut ChatId) -> Resu
                 listblocked\n\
                 ======================================Misc.==\n\
                 getqr [<chat-id>]\n\
+                 getqrsvg [<chat-id>]\n\
                 getbadqr\n\
                 checkqr <qr-content>\n\
                 joinqr <qr-content>\n\
--- a/examples/repl/main.rs
+++ b/examples/repl/main.rs
@@ -33,6 +33,8 @@ use rustyline::{

 mod cmdline;
 use self::cmdline::*;
+use deltachat::qr_code_generator::get_securejoin_qr_svg;
+use std::fs;

 /// Event Handler
 fn receive_event(event: EventType) {
@@ -224,8 +226,9 @@ const CONTACT_COMMANDS: [&str; 9] = [
    "unblock",
    "listblocked",
 ];
-const MISC_COMMANDS: [&str; 11] = [
+const MISC_COMMANDS: [&str; 12] = [
    "getqr",
+    "getqrsvg",
    "getbadqr",
    "checkqr",
    "joinqr",
@@ -427,6 +430,20 @@ async fn handle_cmd(
                io::stderr().write_all(&output.stderr).unwrap();
            }
        }
+        "getqrsvg" => {
+            ctx.start_io().await;
+            let group = arg1.parse::<u32>().ok().map(|id| ChatId::new(id));
+            let file = dirs::home_dir().unwrap_or_default().join("qr.svg");
+            match get_securejoin_qr_svg(&ctx, group).await {
+                Ok(svg) => {
+                    fs::write(&file, svg)?;
+                    println!("QR code svg written to: {:#?}", file);
+                }
+                Err(err) => {
+                    bail!("Failed to get QR code svg: {}", err);
+                }
+            }
+        }
        "joinqr" => {
            ctx.start_io().await;
            if !arg0.is_empty() {
--- a/src/color.rs
+++ b/src/color.rs
@@ -35,6 +35,10 @@ pub(crate) fn str_to_color(s: &str) -> u32 {
    rgb_to_u32(hsluv_to_rgb((str_to_angle(s), 100.0, 50.0)))
 }

+pub fn color_int_to_hex_string(color: u32) -> String {
+    format!("{:#08x}", color).replace("0x", "#")
+}
+
 #[cfg(test)]
 mod tests {
    use super::*;
--- a/src/lib.rs
+++ b/src/lib.rs
@@ -77,6 +77,7 @@ pub mod peerstate;
 pub mod pgp;
 pub mod provider;
 pub mod qr;
+pub mod qr_code_generator;
 pub mod quota;
 pub mod securejoin;
 mod simplify;
--- a/src/qr_code_generator.rs
+++ b/src/qr_code_generator.rs
@@ -0,0 +1,262 @@
+use anyhow::Result;
+use qrcodegen::{QrCode, QrCodeEcc};
+
+use crate::{
+    blob::BlobObject,
+    chat::{Chat, ChatId},
+    color::color_int_to_hex_string,
+    config::Config,
+    constants::DC_CONTACT_ID_SELF,
+    contact::Contact,
+    context::Context,
+    securejoin, stock_str,
+};
+
+pub async fn get_securejoin_qr_svg(context: &Context, chat_id: Option<ChatId>) -> Result<String> {
+    if let Some(chat_id) = chat_id {
+        generate_join_group_qr_code(context, chat_id).await
+    } else {
+        generate_verification_qr(context).await
+    }
+}
+
+async fn generate_join_group_qr_code(context: &Context, chat_id: ChatId) -> Result<String> {
+    let chat = Chat::load_from_db(context, chat_id).await?;
+
+    let avatar = match chat.get_profile_image(context).await? {
+        Some(path) => {
+            let avatar_blob = BlobObject::from_path(context, &path)?;
+            Some(std::fs::read(avatar_blob.to_abs_path())?)
+        }
+        None => None,
+    };
+
+    inner_generate_secure_join_qr_code(
+        &stock_str::secure_join_group_qr_description(context, &chat).await,
+        &securejoin::dc_get_securejoin_qr(context, Some(chat_id)).await?,
+        &color_int_to_hex_string(chat.get_color(context).await?),
+        avatar,
+        chat.get_name().chars().next().unwrap_or('#'),
+    )
+}
+
+async fn generate_verification_qr(context: &Context) -> Result<String> {
+    let contact = Contact::get_by_id(context, DC_CONTACT_ID_SELF).await?;
+
+    let avatar = match contact.get_profile_image(context).await? {
+        Some(path) => {
+            let avatar_blob = BlobObject::from_path(context, &path)?;
+            Some(std::fs::read(avatar_blob.to_abs_path())?)
+        }
+        None => None,
+    };
+
+    let displayname = match context.get_config(Config::Displayname).await? {
+        Some(name) => name,
+        None => contact.get_addr().to_owned(),
+    };
+
+    inner_generate_secure_join_qr_code(
+        &stock_str::setup_contact_qr_description(context, &displayname, contact.get_addr()).await,
+        &securejoin::dc_get_securejoin_qr(context, None).await?,
+        &color_int_to_hex_string(contact.get_color()),
+        avatar,
+        displayname.chars().next().unwrap_or('#'),
+    )
+}
+
+fn inner_generate_secure_join_qr_code(
+    raw_qrcode_description: &str,
+    qrcode_content: &str,
+    color: &str,
+    avatar: Option<Vec<u8>>,
+    avatar_letter: char,
+) -> Result<String> {
+    let qrcode_description = &escaper::encode_minimal(raw_qrcode_description);
+    // config
+    let width = 515.0;
+    let height = 630.0;
+    let logo_offset = 28.0;
+    let qr_code_size = 400.0;
+    let qr_translate_up = 40.0;
+    let text_y_pos = ((height - qr_code_size) / 2.0) + qr_code_size;
+    let (text_font_size, max_text_width) = if qrcode_description.len() <= 75 {
+        (27.0, 32)
+    } else {
+        (19.0, 38)
+    };
+    let avatar_border_size = 9.0;
+    let card_border_size = 2.0;
+    let card_roundness = 40.0;
+
+    let qr = QrCode::encode_text(qrcode_content, QrCodeEcc::Medium)?;
+    let mut svg = String::with_capacity(28000);
+    let mut w = tagger::new(&mut svg);
+
+    w.elem("svg", |d| {
+        d.attr("xmlns", "http://www.w3.org/2000/svg")
+            .attr("viewBox", format_args!("0 0 {} {}", width, height));
+    })
+    .build(|w| {
+        // White Background apears like a card
+        w.single("rect", |d| {
+            d.attr("x", card_border_size)
+                .attr("y", card_border_size)
+                .attr("rx", card_roundness)
+                .attr("stroke", "#c6c6c6")
+                .attr("stroke-width", card_border_size)
+                .attr("width", width - (card_border_size * 2.0))
+                .attr("height", height - (card_border_size * 2.0))
+                .attr("style", "fill:#f2f2f2");
+        });
+        // Qrcode
+        w.elem("g", |d| {
+            d.attr(
+                "transform",
+                format!(
+                    "translate({},{})",
+                    (width - qr_code_size) / 2.0,
+                    ((height - qr_code_size) / 2.0) - qr_translate_up
+                ),
+            );
+            // If the qr code should be in the wrong place,
+            // we could also translate and scale the points in the path already,
+            // but that would make the resulting svg way bigger in size and might bring up rounding issues,
+            // so better avoid doing it manually if possible
+        })
+        .build(|w| {
+            w.single("path", |d| {
+                let mut path_data = String::with_capacity(0);
+                let scale = qr_code_size / qr.size() as f32;
+
+                for y in 0..qr.size() {
+                    for x in 0..qr.size() {
+                        if qr.get_module(x, y) {
+                            path_data += &format!("M{},{}h1v1h-1z", x, y);
+                        }
+                    }
+                }
+
+                d.attr("style", "fill:#000000")
+                    .attr("d", path_data)
+                    .attr("transform", format!("scale({})", scale));
+            });
+        });
+        // Text
+        for (count, line) in textwrap::fill(qrcode_description, max_text_width)
+            .split('\n')
+            .enumerate()
+        {
+            w.elem("text", |d| {
+                d.attr("y", (count as f32 * (text_font_size * 1.2)) + text_y_pos)
+                    .attr("x", width / 2.0)
+                    .attr("text-anchor", "middle")
+                    .attr(
+                        "style",
+                        format!(
+                            "font-family:sans-serif;\
+                        font-weight:bold;\
+                        font-size:{}px;\
+                        fill:#000000;\
+                        stroke:none",
+                            text_font_size
+                        ),
+                    );
+            })
+            .build(|w| {
+                w.put_raw(line);
+            });
+        }
+        // contact avatar in middle of qrcode
+        const LOGO_SIZE: f32 = 94.4;
+        const HALF_LOGO_SIZE: f32 = LOGO_SIZE / 2.0;
+        let logo_position_in_qr = (qr_code_size / 2.0) - HALF_LOGO_SIZE;
+        let logo_position_x = ((width - qr_code_size) / 2.0) + logo_position_in_qr;
+        let logo_position_y =
+            ((height - qr_code_size) / 2.0) - qr_translate_up + logo_position_in_qr;
+
+        w.single("circle", |d| {
+            d.attr("cx", logo_position_x + HALF_LOGO_SIZE)
+                .attr("cy", logo_position_y + HALF_LOGO_SIZE)
+                .attr("r", HALF_LOGO_SIZE + avatar_border_size)
+                .attr("style", "fill:#f2f2f2");
+        });
+
+        if let Some(img) = avatar {
+            w.elem("defs", |_| {}).build(|w| {
+                w.elem("clipPath", |d| {
+                    d.attr("id", "avatar-cut");
+                })
+                .build(|w| {
+                    w.single("circle", |d| {
+                        d.attr("cx", logo_position_x + HALF_LOGO_SIZE)
+                            .attr("cy", logo_position_y + HALF_LOGO_SIZE)
+                            .attr("r", HALF_LOGO_SIZE);
+                    });
+                });
+            });
+
+            w.single("image", |d| {
+                d.attr("x", logo_position_x)
+                    .attr("y", logo_position_y)
+                    .attr("width", HALF_LOGO_SIZE * 2.0)
+                    .attr("height", HALF_LOGO_SIZE * 2.0)
+                    .attr("preserveAspectRatio", "none")
+                    .attr("clip-path", "url(#avatar-cut)")
+                    .attr(
+                        "href" /*might need xlink:href instead if it doesn't work on older devices?*/, 
+                        format!("data:image/jpeg;base64,{}", base64::encode(img)),
+                    );
+            });
+        } else {
+            w.single("circle", |d| {
+                d.attr("cx", logo_position_x + HALF_LOGO_SIZE)
+                    .attr("cy", logo_position_y + HALF_LOGO_SIZE)
+                    .attr("r", HALF_LOGO_SIZE)
+                    .attr("style", format!("fill:{}", &color));
+            });
+
+            let avatar_font_size = LOGO_SIZE * 0.65;
+            let font_offset = avatar_font_size * 0.1;
+            w.elem("text", |d| {
+                d.attr("y", logo_position_y + HALF_LOGO_SIZE + font_offset)
+                    .attr("x", logo_position_x + HALF_LOGO_SIZE)
+                    .attr("text-anchor", "middle")
+                    .attr("dominant-baseline", "central")
+                    .attr("alignment-baseline", "middle")
+                    .attr(
+                        "style",
+                        format!(
+                            "font-family:sans-serif;\
+                            font-weight:400;\
+                            font-size:{}px;\
+                            fill:#ffffff;",
+                            avatar_font_size
+                        ),
+                    );
+            })
+            .build(|w| {
+                w.put_raw(avatar_letter.to_uppercase());
+            });
+        }
+
+        // Footer logo
+        const FOOTER_HEIGHT: f32 = 35.0;
+        const FOOTER_WIDTH: f32 = 198.0;
+        w.elem("g", |d| {
+            d.attr(
+                "transform",
+                format!(
+                    "translate({},{})",
+                    (width - FOOTER_WIDTH) / 2.0,
+                    height - logo_offset - FOOTER_HEIGHT
+                ),
+            );
+        })
+        .build(|w| {
+            w.put_raw(include_str!("../assets/qrcode_logo_footer.svg"));
+        });
+    });
+
+    Ok(svg)
+}
--- a/src/stock_str.rs
+++ b/src/stock_str.rs
@@ -8,7 +8,7 @@ use strum::EnumProperty;
 use strum_macros::EnumProperty;

 use crate::blob::BlobObject;
-use crate::chat::{self, ChatId, ProtectionStatus};
+use crate::chat::{self, Chat, ChatId, ProtectionStatus};
 use crate::config::Config;
 use crate::constants::{Viewtype, DC_CONTACT_ID_SELF};
 use crate::contact::{Contact, Origin};
@@ -330,6 +330,12 @@ pub enum StockMessage {

    #[strum(props(fallback = "%1$s replied, waiting for being added to the group…"))]
    SecureJoinReplies = 118,
+
+    #[strum(props(fallback = "Scan to chat with %1$s"))]
+    SetupContactQRDescription = 119,
+
+    #[strum(props(fallback = "Scan to join group %1$s"))]
+    SecureJoinGroupQRDescription = 120,
 }

 impl StockMessage {
@@ -614,6 +620,29 @@ pub(crate) async fn secure_join_replies(context: &Context, contact_id: u32) -> S
    }
 }

+/// Stock string: `Scan to chat with %1$s`.
+pub(crate) async fn setup_contact_qr_description(
+    context: &Context,
+    display_name: &str,
+    addr: &str,
+) -> String {
+    let name = if display_name == addr {
+        addr.to_owned()
+    } else {
+        format!("{} ({})", display_name, addr)
+    };
+    translated(context, StockMessage::SetupContactQRDescription)
+        .await
+        .replace1(name)
+}
+
+/// Stock string: `Scan to join %1$s`.
+pub(crate) async fn secure_join_group_qr_description(context: &Context, chat: &Chat) -> String {
+    translated(context, StockMessage::SecureJoinGroupQRDescription)
+        .await
+        .replace1(chat.get_name())
+}
+
 /// Stock string: `%1$s verified.`.
 pub(crate) async fn contact_verified(context: &Context, contact_addr: impl AsRef<str>) -> String {
    translated(context, StockMessage::ContactVerified)