Type-I

Type-I ๋Š” ๋ฏธ๋‹ˆ ๊ฒŒ์ž„์—์„œ ์šฐ์Šน์ž๊ฐ€ ๋‚˜์˜ค๊ฑฐ๋‚˜ ํ”Œ๋ ˆ์ด์–ด๊ฐ€ ํŠน์ •๋  ๋•Œ ๋‚˜์˜ค๋Š” Custom Label ์ž…๋‹ˆ๋‹ค.

์ด๋ฏธ์ง€

์˜ˆ์ œ ์ฝ”๋“œ

function showLabelTypeI(player, key, text1, text2) {
    const isMobile = player.isMobile;
    const topGap = isMobile ? 10 : -2; //60px from the top on mobile and 48px on PC.
    /**
     * size-based @labelPercentWidth
     * XL: isMobile ? 90 : 50;
     * L: isMobile ? 80 : 40;
     * M: isMobile ? 70 : 28;
     * S: isMobile ? 60 : 20
     */
    const labelPercentWidth = isMobile ? 60 : 20;
    const labelDisplayTime = 300000;

    const parentStyle = `
    display: flex; 
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    `;

    const firstRowStyle = `
    font-size: ${isMobile ? "14px" : "18px"};
    font-weight: 700; 
    color: white;`;

    const highlightSpanStyle = `
    font-size: ${isMobile ? "14px" : "18px"};
    font-weight: 700; 
    color: #74FADA;
    `;

    const customLabelOption = {
        key: key,
        borderRadius: '12px',
        fontOpacity: false,
        padding: '8px',
    }

    let htmlStr = `<span style="${parentStyle}">
        <span style="${highlightSpanStyle}">${text1}</span>
        <span style="${firstRowStyle}">${text2}</span>
    </span>`;

    player.showCustomLabel(htmlStr, 0xffffff, 0x27262e, topGap, labelPercentWidth, 0.64, labelDisplayTime, customLabelOption);
}

Last updated