https://kotlinlang.org logo
Docs
Join the conversationJoin Slack
Channels
100daysofcode
100daysofkotlin
100daysofkotlin-2021
advent-of-code
aem
ai
alexa
algeria
algolialibraries
amsterdam
android
android-architecture
android-databinding
android-studio
androidgithubprojects
androidthings
androidx
androidx-xprocessing
anime
anko
announcements
apollo-kotlin
appintro
arabic
argentina
arkenv
arksemdevteam
armenia
arrow
arrow-contributors
arrow-meta
ass
atlanta
atm17
atrium
austin
australia
austria
awesome-kotlin
ballast
bangladesh
barcelona
bayarea
bazel
beepiz-libraries
belgium
berlin
big-data
books
boston
brazil
brikk
budapest
build
build-tools
bulgaria
bydgoszcz
cambodia
canada
carrat
carrat-dev
carrat-feed
chicago
chile
china
chucker
cincinnati-user-group
cli
clikt
cloudfoundry
cn
cobalt
code-coverage
codeforces
codemash-precompiler
codereview
codingame
codingconventions
coimbatore
collaborations
colombia
colorado
communities
competitive-programming
competitivecoding
compiler
compose
compose-android
compose-desktop
compose-hiring
compose-ios
compose-mp
compose-ui-showcase
compose-wear
compose-web
connect-audit-events
corda
cork
coroutines
couchbase
coursera
croatia
cryptography
cscenter-course-2016
cucumber-bdd
cyprus
czech
dagger
data2viz
databinding
datascience
dckotlin
debugging
decompose
decouple
denmark
deprecated
detekt
detekt-hint
dev-core
dfw
docs-revamped
dokka
domain-driven-design
doodle
dsl
dublin
dutch
eap
eclipse
ecuador
edinburgh
education
effective-kotlin
effectivekotlin
emacs
embedded-kotlin
estatik
event21-community-content
events
exposed
failgood
fb-internal-demo
feed
firebase
flow
fluid-libraries
forkhandles
forum
fosdem
fp-in-kotlin
framework-elide
freenode
french
fritz2
fuchsia
functional
funktionale
gamedev
ge-kotlin
general-advice
georgia
geospatial
german-lang
getting-started
github-workflows-kt
glance
godot-kotlin
google-io
gradle
graphic
graphkool
graphql
graphql-kotlin
graviton-browser
greece
grpc
gsoc
gui
hackathons
hacktoberfest
hamburg
hamkrest
helios
helsinki
hexagon
hibernate
hikari-cp
hire-me
hiring
hongkong
hoplite
http4k
hungary
hyderabad
image-processing
india
indonesia
inkremental
intellij
intellij-plugins
intellij-tricks
internships
introduce-yourself
io
ios
iran
israel
istanbulcoders
italian
jackson-kotlin
jadx
japanese
jasync-sql
java-to-kotlin-refactoring
javadevelopers
javafx
javalin
javascript
jdbi
jhipster-kotlin
jobsworldwide
jpa
jshdq
juul-libraries
jvm-ir-backend-feedback
jxadapter
k2-early-adopters
kaal
kafka
kakao
kalasim
kapt
karachi
karg
karlsruhe
kash_shell
kaskade
kbuild
kdbc
kgen-doc-tools
kgraphql
kinta
klaxon
klock
kloudformation
kmdc
kmm-español
kmongo
knbt
knote
koalaql
koans
kobalt
kobweb
kodein
kodex
kohesive
koin
koin-dev
komapper
kondor-json
kong
kontent
kontributors
korau
korean
korge
korim
korio
korlibs
korte
kotest
kotest-contributors
kotless
kotlick
kotlin-asia
kotlin-beam
kotlin-by-example
kotlin-csv
kotlin-data-storage
kotlin-foundation
kotlin-fuel
kotlin-in-action
kotlin-inject
kotlin-latam
kotlin-logging
kotlin-multiplatform-contest
kotlin-mumbai
kotlin-native
kotlin-pakistan
kotlin-plugin
kotlin-pune
kotlin-roadmap
kotlin-samples
kotlin-sap
kotlin-serbia
kotlin-spark
kotlin-szeged
kotlin-website
kotlinacademy
kotlinbot
kotlinconf
kotlindl
kotlinforbeginners
kotlingforbeginners
kotlinlondon
kotlinmad
kotlinprogrammers
kotlinsu
kotlintest
kotlintest-devs
kotlintlv
kotlinultimatechallenge
kotlinx-datetime
kotlinx-files
kotlinx-html
kotrix
kotson
kovenant
kprompt
kraph
krawler
kroto-plus
ksp
ktcc
ktfmt
ktlint
ktor
ktp
kubed
kug-leads
kug-torino
kvision
kweb
lambdaworld_cadiz
lanark
language-evolution
language-proposals
latvia
leakcanary
leedskotlinusergroup
lets-have-fun
libgdx
libkgd
library-development
linkeddata
lithuania
london
losangeles
lottie
love
lychee
macedonia
machinelearningbawas
madrid
malaysia
mathematics
meetkotlin
memes
meta
metro-detroit
mexico
miami
micronaut
minnesota
minutest
mirror
mockk
moko
moldova
monsterpuzzle
montreal
moonbean
morocco
motionlayout
mpapt
mu
multiplatform
mumbai
munich
mvikotlin
mvrx
myndocs-oauth2-server
naming
navigation-architecture-component
nepal
new-mexico
new-zealand
newname
nigeria
nodejs
norway
npm-publish
nyc
oceania
ohio-kotlin-users
oldenburg
oolong
opensource
orbit-mvi
osgi
otpisani
package-search
pakistan
panamá
pattern-matching
pbandk
pdx
peru
philippines
phoenix
pinoy
pocketgitclient
polish
popkorn
portugal
practical-functional-programming
proguard
prozis-android-backup
pyhsikal
python
python-contributors
quasar
random
re
react
reaktive
realm
realworldkotlin
reductor
reduks
redux
redux-kotlin
refactoring-to-kotlin
reflect
refreshversions
reports
result
rethink
revolver
rhein-main
rocksdb
romania
room
rpi-pico
rsocket
russian
russian_feed
russian-kotlinasfirst
rx
rxjava
san-diego
science
scotland
scrcast
scrimage
script
scripting
seattle
serialization
server
sg-user-group
singapore
skia-wasm-interop-temp
skrape-it
slovak
snake
sofl-user-group
southafrica
spacemacs
spain
spanish
speaking
spek
spin
splitties
spotify-mobius
spring
spring-security
squarelibraries
stackoverflow
stacks
stayhungrystayfoolish
stdlib
stlouis
strife-discord-lib
strikt
students
stuttgart
sudan
swagger-gradle-codegen
swarm
sweden
swing
swiss-user-group
switzerland
talking-kotlin
tallinn
tampa
teamcity
tegal
tempe
tensorflow
terminal
test
testing
testtestest
texas
tgbotapi
thailand
tornadofx
touchlab-tools
training
tricity-kotlin-user-group
trójmiasto
truth
tunisia
turkey
turkiye
twitter-feed
uae
udacityindia
uk
ukrainian
uniflow
unkonf
uruguay
utah
uuid
vancouver
vankotlin
vertx
videos
vienna
vietnam
vim
vkug
vuejs
web-mpp
webassembly
webrtc
wimix_sentry
wwdc
zircon
Powered by Linen
compose
  • n

    nglauber

    05/19/2021, 7:13 PM
    How can I get the same instance of my ViewModel across navigation? 🤔 I mean, I have a screen
    A
    which instantiate my ViewModel using
    viewModel()
    function. I want to get the same instance of my ViewModel in screen
    B
    after call
    navController.navigate("B")
    …
    i
    i
    • 3
    • 37
  • b

    Barry Fawthrop

    05/19/2021, 7:38 PM
    I have an existing app, which is all XML layout. We have a new upgrade in the pipeline, whereby we'll be shifting from a portrait only, to landscape on tablet devices only. Seems like a great opportunity to implement Compose. Can the existing Activity still be used, even thou some screen will now be Compose and not XML generated? What is the best practice to "phase-in" Compose?
    r
    a
    • 3
    • 2
  • r

    Ryan Simon

    05/19/2021, 7:49 PM
    I watched the video on

    what's new in design tools▾

    , and noticed that the Compose version of ConstraintLayout allows devs to use json to describe constraints. I couldn't find any documentation on it though. Does anyone have a link to the docs for the json constraints?
    z
    • 2
    • 2
  • a

    aipok

    05/19/2021, 8:05 PM
    Does anyone know, if I’m defining my Composable functions inside android library module that afterward used by multiple app modules. It is only possible to run
    @Preview
    on device in case preview functions are declared inside library module? Right now I don’t have the
    run on device
    button near the preview functions unless they are located inside app module. Moving
    @Preview
    functions to app module shows the
    run on device
    icon.
    z
    • 2
    • 3
  • a

    alorma

    05/19/2021, 8:57 PM
    What's the correct way to add some padding at begining of
    LazyXxxx
    that scrolls with the content? ON this example the circles must scroll to the start (left) of the screen, but start with some extra padding
    h
    • 2
    • 3
  • l

    Luis Mierez

    05/19/2021, 10:47 PM
    haven’t been able to find an answer for this, but can a composable pull our default themes that we have in xml? Is there some interop there?
    a
    • 2
    • 2
  • t

    Thiago

    05/20/2021, 1:17 AM
    Hi folks. Is there in anywhere a compose architectural overview like that?
    n
    • 2
    • 1
  • n

    nglauber

    05/20/2021, 3:05 AM
    Reading this topic regarding Compose+ViewModel… Imagine that my screen has 10
    TextField
    … which one would be better: 1) expose a series of LiveData/StateFlow; or 2) encapsulate in a object and every change send a copy of the object just changing one property? (I mean
    myObj.copy(fieldThatChanged=newValue)
    ) https://developer.android.com/jetpack/compose/state#viewmodel-state
    c
    i
    +2
    • 5
    • 15
  • d

    dewildte

    05/20/2021, 3:31 AM
    Is Compose broken on AS Bumblebee?
    :yes: 1
    a
    c
    • 3
    • 4
  • l

    Lukas K-G

    05/20/2021, 4:24 AM
    Does anyone know of a way to capture a click/touch without consuming it? I.e. a transparent overlay over several widgets that “intercepts” the touch, but the control below - i.e. a button - still gets the actual interaction?
    z
    p
    • 3
    • 12
  • j

    Jason Ankers

    05/20/2021, 6:13 AM
    The new navigation state restoration changes are great. One issue(?) we’ve noticed is
    LazyColumn
    scroll position will not be saved if both of these conditions are met: • A screen with a
    LazyColumn
    instantiates a ViewModel with
    hiltViewModel()
    • An item in the
    LazyColumn
    references an unstable object (i.e. a navController) Is this expected?
    j
    i
    • 3
    • 9
  • i

    iamthevoid

    05/20/2021, 6:43 AM
    Hmm, can not find this constant after updating compose-navigation version. Where is it placed now?
    • 1
    • 1
  • i

    Ioane Sharvadze

    05/20/2021, 7:26 AM
    Hello 👋 I was wondering, is state-hoisting having some performance issues with Gesture callbacks? I tried to replicate gesture example from Android official documentation, but with state hoisting, The original version works perfectly, but the one with state-hoisting lags (and box jumps to the beginning). https://stackoverflow.com/q/67615540/4183017
    a
    • 2
    • 2
  • m

    Mikołaj Kąkol

    05/20/2021, 8:43 AM
    what is current latest working setup: kotlin 1.5, compose-b07 and AS-beta1?
    f
    p
    • 3
    • 4
  • k

    Kunal Raghav

    05/20/2021, 8:47 AM
    Hi 👋, is anyone having problems of composables losing internal state when navigated back to from another composable? It didn't happen with the previous beta.
    a
    • 2
    • 2
  • i

    iamthevoid

    05/20/2021, 11:01 AM
    Is there way to force theme switch (day-night) by compose utils, or i must use Context?
    c
    • 2
    • 4
  • k

    Kulwinder Singh

    05/20/2021, 11:04 AM
    How we can show this RED view offset 30% from below ?
    j
    n
    c
    • 4
    • 15
  • t

    than_

    05/20/2021, 11:24 AM
    Hi, I'm having problems with LazyColumn in beta07. Recycled items tend to not get filled with data. Is it a bug or am I missing something?
    screen-20210520-132101~2.mp4
    l
    • 2
    • 2
  • l

    Lucien Guimaraes

    05/20/2021, 11:29 AM
    About the new release of navigation compose, adding
    restoreState = true
    and
    saveState = true
    doesn't seems to resolve the recomposition of screens using BottomNavigation. Here is a video showing screens UI to be reset when switching tabs. Am I missing something to avoid this behaviour ?
    20210520_121636.mp4
    c
    • 2
    • 2
  • d

    Denis Capkovic

    05/20/2021, 11:58 AM
    Hi, is there a way of controlling the position of Keyboard on screen, in Compose? We are modifying the Window manager with
    wm overscan
    , to hide navigation controls all-together (you cannot swipe down to bring up notification shade). But this also moves the keyboard, and hides part of it. Our application is always in landscape and is the only one running. Hacky solutions are welcome.
    c
    • 2
    • 7
  • s

    Shawn Tucker

    05/20/2021, 12:57 PM
    Hello, I am using https://github.com/tehras/charts and I upgraded to beta07. I am getting
    java.lang.NoSuchMethodError: No interface method startRestartGroup
    in class Landroidx/compose/runtime/Composer
    crash when I try to draw a chart. How can I fix this issue?
    p
    i
    • 3
    • 5
  • p

    pawegio

    05/20/2021, 12:59 PM
    In
    navigation-compose
    1.0.0-x
    I was able to pass
    Parcelable
    argument this way:
    currentBackStackEntry?.arguments?.putParcelable(...)
    after updating to
    2.4.0-alpha01
    it seems to no longer work as I see that
    previousBackStackEntry?.arguments?.getParcelable
    returns a
    null
    value in new destination. What’s the right/new way to perform it now?
    i
    j
    • 3
    • 4
  • j

    julioromano

    05/20/2021, 1:29 PM
    https://material.io/components/chips/android Is there anything similar for compose ☝️ (I mean, already available) ?
    p
    • 2
    • 3
  • n

    nitrog42

    05/20/2021, 1:31 PM
    I might have missed something but after updating my dependencies (compose to beta07, fragment to 1.3.4, and others), my app crash after first composition with the following error :
    java.lang.IllegalStateException: Expected applyChanges() to have been called
    does anyone have an idea? the stacktrace doesn't contains any of my code
    • 1
    • 4
  • r

    Rodri Represa

    05/20/2021, 1:35 PM
    Hello!! Does the LazyRow has anything similar to recyclerview’s snaphelper?
    n
    n
    a
    • 4
    • 13
  • t

    TheDukerChip

    05/20/2021, 1:55 PM
    Is there any equivalent for
    app:layout_constraintDimensionRatio
    in compose Searched all through the google and SO got no luck
    s
    • 2
    • 5
  • v

    Vitaliy Zarubin

    05/20/2021, 3:01 PM
    Please tell me what's wrong
    <TextView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:layout_constraintStart_toEndOf="@+id/image"/>
    s
    • 2
    • 1
  • s

    Sergey B

    05/20/2021, 3:02 PM
    Hey guys. Should pure composable function produce the same result if it's called with the same arguments? I'm asking this because I'm experiencing an issue with positioning. See attached video. Here is my code https://gist.github.com/sergey-ben/3622dd192d8e537c41b303cdd757b1fd The result of clicking on "button 1" is different, after the "button 2" is clicked. Is it a bug of compose, or am I missing something?
    video_2021-05-20_18-01-41.mp4
    s
    j
    • 3
    • 5
  • s

    Slackbot

    05/20/2021, 3:15 PM
    This message was deleted.
    m
    • 2
    • 3
  • t

    Timo Drick

    05/20/2021, 3:45 PM
    I often need to block the complete UI for user input. E.g. when user pressed a button and a download need to be done before continue. And i want to avoid double press or pressing other buttons. My approach would be to Overlap the view with an invisible composable (maybe with a progress indicator) which catches all interactions. Are there any best practices how to do this?
    f
    a
    z
    • 4
    • 9
Powered by Linen
Title
t

Timo Drick

05/20/2021, 3:45 PM
I often need to block the complete UI for user input. E.g. when user pressed a button and a download need to be done before continue. And i want to avoid double press or pressing other buttons. My approach would be to Overlap the view with an invisible composable (maybe with a progress indicator) which catches all interactions. Are there any best practices how to do this?
f

Filip Wiesner

05/20/2021, 3:56 PM
I would just disable the button for the loading period and have general loading indicator. The loading does not have to be specific to the button.
a

Aditya Thakar

05/20/2021, 4:53 PM
I would have a separate loading state and update state of the composable to loading on button click (on attempting to start the download). The composable should recompose when the state changes, check the state inside your composable and display loading indicator accordingly. more info on best practices - https://developer.android.com/jetpack/compose/state
z

Zach Klippenstein (he/him) [MOD]

05/20/2021, 6:29 PM
An overlay composable like that is basically the technique the drawers use for their scrims, so that seems reasonable. It blocks accessibility focus for underlying components too.
t

Timo Drick

05/21/2021, 7:26 AM
Thanks @Zach Klippenstein (he/him) [MOD] i will have a look how the drawer implementation does it.
Thx also @Filip Wiesner and @Aditya Thakar for answering. This are of course the correct ways of implementing it when you only have one button on the screen. But i need to disable the complete screen during loading not only a single button. Of course i could implement a state for this and disable every button. But this means i have to change a lot of code. And every time i add a new button there is a risk i forget to disable it during this loading state.
a

Aditya Thakar

05/21/2021, 7:45 AM
@Timo Drick you could have separate composable for content (your buttons) and loading (progress indicator) then based on the state you could decide which one to show with a when statement
t

Timo Drick

05/21/2021, 7:49 AM
I want to avoid filckering in the UI so when the download takes less than 300 ms i do not want to show a loading spinner or change the UI. So only one transition is visible when the download is finished. But when the download takes more than 300 ms i am showing the loading spinner but often i do not want to change the complete screen just show an overlay. But yes i do it this way now that i just show a Invisible Box in over the complete area which should be disabled.
👍 1
So my current solution is following:
Box() {
    content(myContent)
    if (blockUI) Box(Modifier.matchParentSize().pointerInput(onDismissRequest) { detectTapGestures {  } })
}
Ok here a more elaborated version of the overlay:
/**
 * Locks the UI behind and after 300 ms it overlays the screen with the defined color and show a progress indicator.
 */
@Composable
private fun ProgressScrim(
    modifier: Modifier = Modifier,
    color: Color = Color.Black,
    onDismiss: () -> Unit = {}
) {
    var showScrim by remember { mutableStateOf(false) }
    LaunchedEffect(key1 = onDismiss) {
        delay(300)
        showScrim = true
    }
    val alpha by animateFloatAsState(
        targetValue = if (showScrim) .8f else 0f,
        animationSpec = TweenSpec()
    )
    Box(
        modifier
            .pointerInput(onDismiss) {
                detectTapGestures { onDismiss() }
            }
            .semantics(mergeDescendants = true) {
                contentDescription = "Progress overlay"
                onClick { onDismiss(); true }
            },
        contentAlignment = Alignment.Center
    ) {
        if (showScrim) {
            Canvas(Modifier.fillMaxSize()) {
                drawRect(color = color, alpha = alpha)
            }
            CircularProgressIndicator()
        }
    }
}
👍 1
View count: 2