图标列

简介

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

use Filament\Tables\Columns\IconColumn;
use Filament\Support\Icons\Heroicon;

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

TIP

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

自定义颜色

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

use Filament\Tables\Columns\IconColumn;

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

通过向 color() 传入函数，可以根据列的状态自定义颜色：

use Filament\Tables\Columns\IconColumn;

IconColumn::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\Tables\Columns\IconColumn;
use Filament\Support\Enums\IconSize;

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

TIP

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

处理布尔值

图标列可以使用 boolean() 方法，根据列状态为 true 或 false 显示对勾或「X」图标：

use Filament\Tables\Columns\IconColumn;

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

如果模型类中该属性已被强制转换为 `bool` 或 `boolean`，Filament 能够检测到这一点，你无需手动使用 `boolean()`。

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

use Filament\Tables\Columns\IconColumn;

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

TIP

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

自定义布尔图标

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

use Filament\Tables\Columns\IconColumn;
use Filament\Support\Icons\Heroicon;

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

TIP

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

自定义布尔颜色

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

use Filament\Tables\Columns\IconColumn;

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

TIP

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

换行显示多个图标

显示多个图标时，若无法在一行内放下，可使用 wrap() 使其换行：

use Filament\Tables\Columns\IconColumn;

IconColumn::make('icon')
    ->wrap()

TIP

换行所用的「宽度」会受列标签影响，因此你可能需要使用更短或隐藏的标签，以实现更紧凑的换行。