AskOverflow.Dev

AskOverflow.Dev Logo AskOverflow.Dev Logo

AskOverflow.Dev Navigation

  • Início
  • system&network
  • Ubuntu
  • Unix
  • DBA
  • Computer
  • Coding
  • LangChain

Mobile menu

Close
  • Início
  • system&network
    • Recentes
    • Highest score
    • tags
  • Ubuntu
    • Recentes
    • Highest score
    • tags
  • Unix
    • Recentes
    • tags
  • DBA
    • Recentes
    • tags
  • Computer
    • Recentes
    • tags
  • Coding
    • Recentes
    • tags
Início / coding / Perguntas / 78564838
Accepted
Muhammad Ahmed AbuTalib
Muhammad Ahmed AbuTalib
Asked: 2024-06-02 04:19:39 +0800 CST2024-06-02 04:19:39 +0800 CST 2024-06-02 04:19:39 +0800 CST

Desenhando fora do limite do contêiner no jetpack compose

  • 772

Preciso fazer um container com cantos arredondados, que tenha um círculo encaixado de forma que metade fique fora do container e a outra metade dentro. Consegui um retângulo sem cantos arredondados com o código abaixo retângulo normal sem cantos arredondados

 Box(modifier = Modifier
    .fillMaxWidth()
    .height(100.dp)
    .padding(top = 20.dp)
    
    .background(ColorScheme.Quaternary.toColor().first)
    ) {
    Box(
        modifier = Modifier
            .layout { measurable, constraints ->
                // Measure the child
                val placeable = measurable.measure(constraints)

                // Set the width and height of the layout as measured
                layout(placeable.width, placeable.height) {
                    // Place the child such that half of it is outside the top boundary
                    placeable.place(0, -25.dp.roundToPx())  // Moves the circle up by 25dp
                }
            }
            .size(50.dp)
            .clip(CircleShape)
            .background(Color.Red)

    )
}

Quando tento arredondar o contêiner, o círculo vermelho também fica cortado

insira a descrição da imagem aqui

Este é o código onde chamei clip no modificador (observe que também tentei chamar clip em posições diferentes no modificador change , mas o efeito é o mesmo)

Box(modifier = Modifier
    .fillMaxWidth()
    .height(100.dp)
    .padding(top = 20.dp)
    .clip(RoundedCornerShape(10.dp))
    .background(ColorScheme.Quaternary.toColor().first)
    ) {
    Box(
        modifier = Modifier
            .layout { measurable, constraints ->
                // Measure the child
                val placeable = measurable.measure(constraints)

                // Set the width and height of the layout as measured
                layout(placeable.width, placeable.height) {
                    // Place the child such that half of it is outside the top boundary
                    placeable.place(0, -25.dp.roundToPx())  // Moves the circle up by 25dp
                }
            }
            .size(50.dp)
            .clip(CircleShape)
            .background(Color.Red)

    )
}

alguma ideia pessoal?

android-jetpack-compose
  • 1 1 respostas
  • 23 Views

1 respostas

  • Voted
  1. Best Answer
    Thracian
    2024-06-02T04:32:38+08:002024-06-02T04:32:38+08:00

    No Jetpack Compose, nenhum dos Composables ou desenhos dentro do DrawScope via Modifier.drawWBehind/WithContent/WİthCache não são cortados, a menos que o pai chame Modifier.clip(), Modifier.graphicsLayer{clip = true}diretamente ou nos bastidores.

    Você pode remover Modifier.clip(RoundedCornerShape(10.dp))do elemento pai que pode ser composto e alterar o plano de fundo com

    Modifier.background(ColorScheme.Quaternary.toColor().first, RoundedCornerShape(10.dp))
    

    Você também pode Modifier.drawBehind para desenhar um retângulo arredondado e um círculo atrás do elemento que pode ser composto como

    Box(modifier = Modifier
        .fillMaxWidth()
        .height(100.dp)
        .padding(top = 20.dp)
        .drawBehind {
            drawRoundRect(
                color = Color.Gray,
                cornerRadius = CornerRadius(10.dp.toPx(), 10.dp.toPx())
            )
            drawCircle(
                color = Color.Red,
                radius =  25.dp.toPx(),
                center = Offset(25.dp.toPx(), 0f)
            )
        }
    )
    
    • 1

relate perguntas

  • Por que o Jetpack Compose está usando o estado antigo no evento onTap

  • Aplicar efeito de pincel a uma palavra inteira enquanto anima cada letra individualmente no Jetpack Compose

  • Problema com o Canvas no Jetpack Compose que não limpa o conteúdo desenhado ao definir StateFlow como nulo

  • Como fazer notas de piano no Jetpack Compose?

Sidebar

Stats

  • Perguntas 205573
  • respostas 270741
  • best respostas 135370
  • utilizador 68524
  • Highest score
  • respostas
  • Marko Smith

    Vue 3: Erro na criação "Identificador esperado, mas encontrado 'import'" [duplicado]

    • 1 respostas
  • Marko Smith

    Por que esse código Java simples e pequeno roda 30x mais rápido em todas as JVMs Graal, mas não em nenhuma JVM Oracle?

    • 1 respostas
  • Marko Smith

    Qual é o propósito de `enum class` com um tipo subjacente especificado, mas sem enumeradores?

    • 1 respostas
  • Marko Smith

    Como faço para corrigir um erro MODULE_NOT_FOUND para um módulo que não importei manualmente?

    • 6 respostas
  • Marko Smith

    `(expression, lvalue) = rvalue` é uma atribuição válida em C ou C++? Por que alguns compiladores aceitam/rejeitam isso?

    • 3 respostas
  • Marko Smith

    Quando devo usar um std::inplace_vector em vez de um std::vector?

    • 3 respostas
  • Marko Smith

    Um programa vazio que não faz nada em C++ precisa de um heap de 204 KB, mas não em C

    • 1 respostas
  • Marko Smith

    PowerBI atualmente quebrado com BigQuery: problema de driver Simba com atualização do Windows

    • 2 respostas
  • Marko Smith

    AdMob: MobileAds.initialize() - "java.lang.Integer não pode ser convertido em java.lang.String" para alguns dispositivos

    • 1 respostas
  • Marko Smith

    Estou tentando fazer o jogo pacman usando apenas o módulo Turtle Random e Math

    • 1 respostas
  • Martin Hope
    Aleksandr Dubinsky Por que a correspondência de padrões com o switch no InetAddress falha com 'não cobre todos os valores de entrada possíveis'? 2024-12-23 06:56:21 +0800 CST
  • Martin Hope
    Phillip Borge Por que esse código Java simples e pequeno roda 30x mais rápido em todas as JVMs Graal, mas não em nenhuma JVM Oracle? 2024-12-12 20:46:46 +0800 CST
  • Martin Hope
    Oodini Qual é o propósito de `enum class` com um tipo subjacente especificado, mas sem enumeradores? 2024-12-12 06:27:11 +0800 CST
  • Martin Hope
    sleeptightAnsiC `(expression, lvalue) = rvalue` é uma atribuição válida em C ou C++? Por que alguns compiladores aceitam/rejeitam isso? 2024-11-09 07:18:53 +0800 CST
  • Martin Hope
    The Mad Gamer Quando devo usar um std::inplace_vector em vez de um std::vector? 2024-10-29 23:01:00 +0800 CST
  • Martin Hope
    Chad Feller O ponto e vírgula agora é opcional em condicionais bash com [[ .. ]] na versão 5.2? 2024-10-21 05:50:33 +0800 CST
  • Martin Hope
    Wrench Por que um traço duplo (--) faz com que esta cláusula MariaDB seja avaliada como verdadeira? 2024-05-05 13:37:20 +0800 CST
  • Martin Hope
    Waket Zheng Por que `dict(id=1, **{'id': 2})` às vezes gera `KeyError: 'id'` em vez de um TypeError? 2024-05-04 14:19:19 +0800 CST
  • Martin Hope
    user924 AdMob: MobileAds.initialize() - "java.lang.Integer não pode ser convertido em java.lang.String" para alguns dispositivos 2024-03-20 03:12:31 +0800 CST
  • Martin Hope
    MarkB Por que o GCC gera código que executa condicionalmente uma implementação SIMD? 2024-02-17 06:17:14 +0800 CST

Hot tag

python javascript c++ c# java typescript sql reactjs html

Explore

  • Início
  • Perguntas
    • Recentes
    • Highest score
  • tag
  • help

Footer

AskOverflow.Dev

About Us

  • About Us
  • Contact Us

Legal Stuff

  • Privacy Policy

Language

  • Pt
  • Server
  • Unix

© 2023 AskOverflow.DEV All Rights Reserve