F
Filament•2y ago
José

How set 3 column?

Hello, when I started with stat widget the first 6 cards were displayed well one next to the other (column of 3) but when I added more cards they began to put one under the other like this and they changed to 1 single column, attached capture, does anyone know what causes this automatic change? How can I make it 3 columns? I tried protected int | string | array $columnSpan = 3; but nothing change
14 Replies
LeandroFerreira
LeandroFerreira•2y ago
José
JoséOP•2y ago
Hello @Leandro Ferreira I followed the steps of your link but same result, attached screenshot....why can be?
krekas
krekas•2y ago
Don't make three cards, make one
José
JoséOP•2y ago
what do you mean? I want to show different metrics in total are 13 metrics...and I want to show them for each row 3 columns
moaaz_m_f
moaaz_m_f•2y ago
No need for all this. just use the getColumns function in your widgets for the below code am using the filament demo. so in the resources I have widgets inside it I have this file StatsOverviewWidget to display my stats widgets. 
    protected function getColumns(): int
    {
        return match ($count = count(BaseWidget::getCachedCards())) {
            4, 5, 6, 9, 11 => 3,
            7, 8, 10, 12, 13, 14, 15 => 4,
            default => $count,
        };
    }
    protected function getColumns(): int
    {
        return match ($count = count(BaseWidget::getCachedCards())) {
            4, 5, 6, 9, 11 => 3,
            7, 8, 10, 12, 13, 14, 15 => 4,
            default => $count,
        };
    }
add the getColumns() function
Dan Harrin
Dan Harrin•2y ago
you can just return a simple int from getColumns like 3 the match () is just used to intelligently predict how many cards to put in a row
moaaz_m_f
moaaz_m_f•2y ago
@Dan Harrin oh, I took the long way! thank you. I believe this is for the dashboard's widgets, the stats has their own getColumns() method. that's why in the filament demo the stats are 3 columns, and the rest are 2. the default getColumns() for the dashboard returns 2; but for the stat it's different.(either 3 or 4 ) that's why there is no need to make a new dashboard if the developer just wants to customize the stats columns.
José
JoséOP•2y ago
I'm confused now, I just want to show the cards in 3 columns, I already removed the dashboard as you suggested, I add that function but it gives an error, why is something so simple so complicated? 😅
Dan Harrin
Dan Harrin•2y ago
what is the error
José
JoséOP•2y ago
Declaration of App\Filament\Widgets\StatsOverview::getColumns(): array|int must be compatible with Filament\Widgets\StatsOverviewWidget::getColumns(): int
Dan Harrin
Dan Harrin•2y ago
have you read it? this is not filaments fault you need int instead of int | array
LeandroFerreira
LeandroFerreira•2y ago
add in StatsOverview.php 
protected int | string | array $columnSpan = 'full';

protected function getColumns(): int
{
    return 3;
}
protected int | string | array $columnSpan = 'full';

protected function getColumns(): int
{
    return 3;
}
Dan Harrin
Dan Harrin•2y ago
you can use an IDE to override methods for you, so the signature is always correct
José
JoséOP•2y ago
it work thanks!

Did you find this page helpful?