图标条目

简介

图标条目会渲染一个表示条目状态的 图标：

use Filament\Infolists\Components\IconEntry;
use Filament\Support\Icons\Heroicon;

IconEntry::make('status')
    ->icon(fn (string $state): Heroicon => match ($state) {
        'draft' => Heroicon::OutlinedPencil,
        'reviewing' => Heroicon::OutlinedClock,
        'published' => Heroicon::OutlinedCheckCircle,
    })

TIP

icon() 方法可将各种工具作为参数注入该函数。

自定义颜色

可使用 color() 方法更改图标的 颜色：

use Filament\Infolists\Components\IconEntry;

IconEntry::make('status')
    ->color('success')

向 color() 传入函数时，可根据条目状态自定义颜色：

use Filament\Infolists\Components\IconEntry;

IconEntry::make('status')
    ->color(fn (string $state): string => match ($state) {
        'draft' => 'info',
        'reviewing' => 'warning',
        'published' => 'success',
        default => 'gray',
    })

TIP

color() 方法可将各种工具作为参数注入该函数。

自定义大小

默认图标大小为 IconSize::Large，也可自定义为 IconSize::ExtraSmall、IconSize::Small、IconSize::Medium、IconSize::ExtraLarge 或 IconSize::TwoExtraLarge：

use Filament\Infolists\Components\IconEntry;
use Filament\Support\Enums\IconSize;

IconEntry::make('status')
    ->size(IconSize::Medium)

TIP

除了接受静态值外，size() 方法也接受函数以动态计算。你可以将各种工具作为参数注入该函数。

处理布尔值

使用 boolean() 方法时，图标条目可根据条目状态（true 或 false）显示勾选或「X」图标：

use Filament\Infolists\Components\IconEntry;

IconEntry::make('is_featured')
    ->boolean()

若模型类中该属性已转换为 `bool` 或 `boolean`，Filament 能自动检测，无需手动使用 `boolean()`。

也可传入布尔值，以控制图标是否按布尔方式显示：

use Filament\Infolists\Components\IconEntry;

IconEntry::make('is_featured')
    ->boolean(FeatureFlag::active())

TIP

除了接受静态值外，boolean() 方法也接受函数以动态计算。你可以将各种工具作为参数注入该函数。

自定义布尔图标

可自定义表示各状态的 图标：

use Filament\Infolists\Components\IconEntry;
use Filament\Support\Icons\Heroicon;

IconEntry::make('is_featured')
    ->boolean()
    ->trueIcon(Heroicon::OutlinedCheckBadge)
    ->falseIcon(Heroicon::OutlinedXMark)

TIP

除了接受静态值外，trueIcon() 与 falseIcon() 方法也接受函数以动态计算。你可以将各种工具作为参数注入这些函数。

自定义布尔颜色

可自定义表示各状态的图标 颜色：

use Filament\Infolists\Components\IconEntry;

IconEntry::make('is_featured')
    ->boolean()
    ->trueColor('info')
    ->falseColor('warning')

TIP

除了接受静态值外，trueColor() 与 falseColor() 方法也接受函数以动态计算。你可以将各种工具作为参数注入这些函数。