es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

SwiftUI – Relleno de cápsula hasta StrokeBorder

12 Jul, 2023 Programación

Estoy tratando de rellenar el borde de la cápsula strokeBorder pero desafortunadamente está rellenando el rectángulo. Ver imagen a continuación:

enter image description here

¿Alguna idea de cómo puedo hacer que se rellene solo hasta el borde del strokeborder? Quiero usar el campo como cuadro de búsqueda, por eso quiero usar el textfield en él.

Aquí está mi código:

struct ContentView: View {

    var body: some View {
        HStack{
            TextField("Buscar", text: .constant(""))
        }
        .padding()
        .frame(maxWidth:300)
        .background(
            Capsule()
                .strokeBorder(Color.black,lineWidth: 0.8)
                .background(Color.blue)
                .clipped()
        )
    }
}

¡Muchas gracias!

Tags:  , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Para hacer que la cápsula strokeBorder se llene hasta el borde solamente, puedes eliminar el modificador .background y utilizarlo como una vista separada. Aquí está el código modificado:

    struct ContentView: View {

    var body: some View {

        HStack{
            TextField("Buscar", text: .constant(""))
        }
        .padding()
        .frame(maxWidth:300)
        .background(
            Capsule()
                .strokeBorder(Color.black,lineWidth: 0.8)
                .clipped()
        )
        .overlay(
            Capsule()
                .fill(Color.blue)
                .clipped()
        )
    }
}

    Al utilizar el modificador .overlay, podemos agregar el color azul dentro de la cápsula para que se llene solo hasta el strokeBorder. Esto debería darte el resultado deseado.

Comments are closed.