Chip

Search for usage in LXR

Chip Class Reference
Inheritance diagram for Chip:

Properties

color color
 
alias iconSource
 
alias imageSource
 
alias label
 
bool showCloseButton
 

Signals

void close ()
 

Detailed Description

This an information element, similar to a button, but more compact.

Since
org.mauikit.controls 1.0

Chips allow users to enter information, make selections, filter content, or trigger actions. While buttons are expected to appear consistently and with familiar calls to action, chips should appear dynamically as a group of multiple interactive elements.

This component is similar to the MauiKit Badge control, but this one is interactive.

See also
Badge
Colorful chips
Flow
{
width: 400
anchors.centerIn: parent
spacing: Maui.Style.space.big
Maui.Chip
{
text: "Chip1"
color: "#757575"
}
Maui.Chip
{
text: "Chip2"
icon.name: "actor"
color: "#03A9F4"
}
Maui.Chip
{
text: "Chip3"
icon.name: "anchor"
color: "#4CAF50"
}
Maui.Chip
{
text: "Chip4"
color: "#E1BEE7"
}
Maui.Chip
{
text: "Chip5"
color: "#FFC107"
}
Maui.Chip
{
text: "Chip6"
color: "#607D8B"
}
Maui.Chip
{
text: "Chip7"
color: "#FF5722"
icon.source: "/home/camiloh/Downloads/5911329.jpeg"
}
}

You can find a more complete example at this link.

Definition at line 74 of file Chip.qml.

Property Documentation

◆ color

color Chip::color
read

The background color for the chip.

The label text color will be adapted from this color considering the brightness, to use either a light or dark text color.

Definition at line 110 of file Chip.qml.

◆ iconSource

string Chip::iconSource
read

The name of the icon to be used.

This is an alias to the icon.name group property.

Definition at line 95 of file Chip.qml.

◆ imageSource

url Chip::imageSource
read

The name of the image source to be used.

This is an alias to the icon.source group property.

Definition at line 101 of file Chip.qml.

◆ label

Label Chip::label
read

The Label element used for the title text.

This is exposed to tweak the text font properties.

Definition at line 89 of file Chip.qml.

◆ showCloseButton

bool Chip::showCloseButton
read

Whether a close button should be displayed, to dismiss the chip.

By default it is set to false.

Definition at line 106 of file Chip.qml.

Member Function Documentation

◆ close

void Chip::close ( )
signal

Emitted once the close button is clicked.

To enable the close button see the showCloseButton: true property.

See also
showCloseButton

The documentation for this class was generated from the following file:
color color
The background color for the chip.
Definition: Chip.qml:110
This file is part of the KDE documentation.
Documentation copyright © 1996-2024 The KDE developers.
Generated on Thu Feb 15 2024 04:05:55 by doxygen 1.8.17 written by Dimitri van Heesch, © 1997-2006

KDE's Doxygen guidelines are available online.