Card Mini Widget

Il widget CardContent è progettato per mostrare contenuti in una card personalizzabile. Accetta come parametro un oggetto CardViewModel che consente di configurare diversi aspetti del layout, del contenuto e del comportamento della card.

Costruttore

Il costruttore di CardContent è definito come segue:

CardContent({
    required CardViewModel cardViewModel,
});

Parametri:

  • cardViewModel: un’istanza di CardViewModel che specifica le configurazioni della card, tra cui il contenuto principale, l’intestazione, la sezione inferiore e l’overlay.

Questa tipologia è simile alla Card Extended, unica differenza è sul layout builder che in questo caso è EvaCardMiniLayoutBuilder.

Varianti di utilizzo

Variante 1

Questa variante presenta l’overlay item con data, il check attivo e il content.

../../../_images/card-mini1.png 
CardContent(
        cardViewModel: CardViewModel(
          headerConfig: CardHeaderConfig(imageUrl: "https://www.snow-mirror.com/wp-content/uploads/2020/07/product-demo-themes.jpg"),
          config: CardConfig(layoutBuilder: EvaCardMiniLayoutBuilder(), onTap: (CardViewModel item) {}),
          contentConfig: CardContentConfig(
            title: IconTextViewModel(text: "Mostra del maestro\nSalvador Dalì", maxLines: 2),
            subDescription: IconTextViewModel(
                textTextStyle: colorScheme?.subDescriptionTextStyle,
                text: "Chiostro del Bramante",
                leftWidgetRightMargin: 4,
                edgeInsets: const EdgeInsets.only(top: 4.5),
                leftWidget: SvgPicture.asset(EvaUiKitResources.icMapLocation.assetName,
                    package: EvaUiKitResources.icMapLocation.packageName, width: 12, height: 12, color: Colors.blue)),
          ),
          overlayConfig: OverlayItemConfig(isChecked: true, onTap: () {}, startDate: DateTime.now(), endDate: DateTime.now()),
        ),
      )

Variante 2

Questa variante presenta l’overlay item con l’icona, il check disattivato e il content.

../../../_images/card-mini2.png 
CardContent(
        cardViewModel: CardViewModel(
          headerConfig: CardHeaderConfig(imageUrl: "https://www.snow-mirror.com/wp-content/uploads/2020/07/product-demo-themes.jpg"),
          config: CardConfig(layoutBuilder: EvaCardMiniLayoutBuilder(), onTap: (CardViewModel item) {}),
          contentConfig: CardContentConfig(
            title: IconTextViewModel(text: "Mostra del maestro\nSalvador Dalì", maxLines: 2),
            subDescription: IconTextViewModel(
                textTextStyle: colorScheme?.subDescriptionTextStyle,
                text: "Chiostro del Bramante",
                leftWidgetRightMargin: 4,
                edgeInsets: const EdgeInsets.only(top: 4.5),
                leftWidget: SvgPicture.asset(EvaUiKitResources.icMapLocation.assetName,
                    package: EvaUiKitResources.icMapLocation.packageName, width: 12, height: 12, color: Colors.blue)),
          ),
          overlayConfig: OverlayItemConfig(isChecked: false, onTap: () {}, icon: EvaUiKitDemoResources.icTime),
        ),
      )

Variante 3

Questa variante presenta l’overlay con range di date, il check attivo e il content.

../../../_images/card-mini3.png 
CardContent(
        cardViewModel: CardViewModel(
          headerConfig: CardHeaderConfig(imageUrl: "https://www.snow-mirror.com/wp-content/uploads/2020/07/product-demo-themes.jpg"),
          config: CardConfig(layoutBuilder: EvaCardMiniLayoutBuilder(), onTap: (CardViewModel item) {}),
          contentConfig: CardContentConfig(
            title: IconTextViewModel(text: "Mostra del maestro\nSalvador Dalì", maxLines: 2),
            subDescription: IconTextViewModel(
                textTextStyle: colorScheme?.subDescriptionTextStyle,
                text: "Chiostro del Bramante",
                leftWidgetRightMargin: 4,
                edgeInsets: const EdgeInsets.only(top: 4.5),
                leftWidget: SvgPicture.asset(EvaUiKitResources.icMapLocation.assetName,
                    package: EvaUiKitResources.icMapLocation.packageName, width: 12, height: 12, color: Colors.blue)),
          ),
          overlayConfig: OverlayItemConfig(
              orientation: EvaCardOverlayItemContentDoubleOrientation.horizontal,
              isChecked: true,
              onTap: () {},
              startDate: DateTime.now(),
              endDate: DateTime.now().add(const Duration(days: 5))),
        ),
      )