https://kotlinlang.org logo
#compose-web
Title
# compose-web
j

Justin Salér

10/01/2023, 3:41 AM
Anyone who have been able to create a website in Compose Web/Canvas that looks good on both desktop and phone? I got really satisfied with how it looks on computer web but on a phone web it just looks so tiny. It is like I would want the scale of my dps to be twice as big. 😅
image.png,image.png
j

jamshedalamqaderi

10/01/2023, 3:45 AM
compose canvas web is still under experimental and i also had the issue that you have for my portfolio.
canvas width is not fit with mobile width. The minium width always 900+ dp
😮‍💨 1
p

Pablichjenkov

10/01/2023, 3:48 AM
compose-web for mobile is at an early stage yet. Especially the touch event support.
👍 1
j

Justin Salér

10/01/2023, 6:28 AM
@jamshedalamqaderi Thank you for your input and perspective! did you use any wise workaround? Using larger sizes on mobile? Using larger sizes when the total width is much higher?
j

jamshedalamqaderi

10/01/2023, 6:33 AM
Here's the same question i've asked in an issue https://github.com/JetBrains/compose-multiplatform/issues/3491
FYI, there's no workaround for mobile until now. Because they didn't have plan for web this time. Maybe need some months
🫠 1
🔥 1
👆 1
s

Suhaib Roomy

10/02/2023, 9:59 AM
I added this line in the
head
section of
index.html
which fixed this for me
Copy code
<meta name="viewport" content="width=device-width, initial-scale=1" />
j

jamshedalamqaderi

10/02/2023, 1:00 PM
Adding viewport won't effect anything in compose canvas. I've added it on my site but not working...
j

Justin Salér

10/03/2023, 7:20 AM
Thank you @Suhaib Roomy. It didn’t seem to fix it for me 😕 .
Also, in addition to the strange size of the canvas. None of the buttons work on my phone 😕 . Maybe it is related to WASM GC?
p

Pablichjenkov

10/03/2023, 7:45 AM
It is related to the touch input not being properly propagated. Touch in the button surrounding and you might hit a tap. There are a couple of issues already reporting these problems, so we just have to wait 🤷🏻
please wait 1
s

Suhaib Roomy

10/03/2023, 12:55 PM
@Justin Salér I didn't test on an actual phone but in inspect mode in desktop chrome. I can try in an actual phone and let you know
16 Views