Skip to main content

In-Cell Progress Bar for Each Record

Show first post

R

You guys are mind-blowing… i spend HOURS trying to work what the best LAYOUT is on my airtables!
Ok, so I have yet another layer of complexity to add here:
I want the progress bar to update according to the amount of tasks completed (already calculated from two other Lookup cells to get the relevant info from TASKS tab)
I have a box already for the numbers of tasks complete :slightly_smiling_face:

Can anyone help on how would I go about that?

G
Forum|alt.badge.img+3
  • G_T
  • New Participant
  • 4 replies
  • September 12, 2022

This was an excellent thread! Thank you for the formulas.

I wanted to comment with a slightly updated version.

I took the progress bar from above and altered it via these items:

  • made a version that has a continuous progress bar (no boxes or squares)
  • made a version that is small for mobile devices

Plus, I added a component, to show how many tasks for a project are in the following status. I spaced them out so they always appear on the left, in the middle, or on the right;

  • To Do - shown via this symbol ⎋
  • Waiting (on someone) - shown via this symbol ⏎
  • In Progress - shown via this symbol ➤

B
1 person likes this
  • B
    Brad_Williams
G
Forum|alt.badge.img+3
  • G_T
  • New Participant
  • September 12, 2022
G_T wrote:

This was an excellent thread! Thank you for the formulas.

I wanted to comment with a slightly updated version.

I took the progress bar from above and altered it via these items:

  • made a version that has a continuous progress bar (no boxes or squares)
  • made a version that is small for mobile devices

Plus, I added a component, to show how many tasks for a project are in the following status. I spaced them out so they always appear on the left, in the middle, or on the right;

  • To Do - shown via this symbol ⎋
  • Waiting (on someone) - shown via this symbol ⏎
  • In Progress - shown via this symbol ➤


The graphic comes from these fields
Combination Field

CompletionBar&'\n'&{Status graphic}

CompletionBar field
(this is the same formula from above, but I replaced the square progress indicators with different ones, called Full Width within Apple Emoji keyboard. The full width aspect lets them touch, appearing as if it is a continuous indicator, instead of boxes lined up in a row

IF(
    PercentDone >= 0,
    REPT(
        '▅',
        ROUND( MIN(PercentDone, 1) * 10 )
    )
    &
    REPT(
        '﹏',
        10 - ROUND( MIN(PercentDone, 1) * 10)
    )
    &
    ' '
    &
    INT( MIN(PercentDone, 1) * 100 )
    &
    '%'
)

Status Graphic field

IF({rollupDONE matches percent done}="✔️Confirmed Done","☑️Done",CONCATENATE(
  IF(
    AND({⎋count To Do}>0,{⎋count To Do}<10),
    "⎋"&{⎋count To Do}&"               ",
    IF(
      {⎋count To Do}>=10,
      "⎋"&{⎋count To Do}&"             ","                      ")),
      IF(
        AND({⏎count Waiting}>0,{⏎count Waiting}<10),
        "⏎"&{⏎count Waiting}&"               ",
        IF({⏎count Waiting}>=10,"⏎"&{⏎count Waiting}&"             ",
        "                      ")),
  IF({➤count InProgress},"➤"&{➤count InProgress},BLANK())))
B
1 person likes this
  • B
    Brad_Williams
J
Forum|alt.badge.img+9
Brian_Beard wrote:

This is an amazing Thread, and thanks for providing such a great formula. I tweaked it a bit to ensure the spacing stays aligned when the Percentage # in front of the Progress bar has 1,2, or 3 digit pad.

So you have this vs 

IF(LEN(INT(
            (IF(
                BarCurrent<=BarGoal,
                BarCurrent,
                BarGoal
                )/BarGoal)*100
            )&'')=1,INT(
            (IF(
                BarCurrent<=BarGoal,
                BarCurrent,
                BarGoal
                )/BarGoal)*100
            )& "%-- "&
    REPT(
        '⬛️',
        ROUND(
            (IF(
                BarCurrent<=BarGoal,
                BarCurrent,
                BarGoal
                )/BarGoal)*10
            )
        )
        &
    REPT(
        '🔲',
        ROUND(
            10-(IF(
               BarCurrent<=BarGoal,
                BarCurrent,
                BarGoal
                )/BarGoal*10),0
            )
        ),IF(LEN(INT(
            (IF(
                BarCurrent<=BarGoal,
                BarCurrent,
                BarGoal
                )/BarGoal)*100
            )&'')=2,INT(
            (IF(
                BarCurrent<=BarGoal,
                BarCurrent,
                BarGoal
                )/BarGoal)*100
            )& "%- "&
    REPT(
        '⬛️',
        ROUND(
            (IF(
                BarCurrent<=BarGoal,
                BarCurrent,
                BarGoal
                )/BarGoal)*10
            )
        )
        &
    REPT(
        '🔲',
        ROUND(
            10-(IF(
               BarCurrent<=BarGoal,
                BarCurrent,
                BarGoal
                )/BarGoal*10),0
            )
        ),IF(LEN(INT(
            (IF(
                BarCurrent<=BarGoal,
                BarCurrent,
                BarGoal
                )/BarGoal)*100
            )&'')=3,INT(
            (IF(
                BarCurrent<=BarGoal,
                BarCurrent,
                BarGoal
                )/BarGoal)*100
            )& "% "&
    REPT(
        '⬛️',
        ROUND(
            (IF(
                BarCurrent<=BarGoal,
                BarCurrent,
                BarGoal
                )/BarGoal)*10
            )
        )
        &
    REPT(
        '🔲',
        ROUND(
            10-(IF(
               BarCurrent<=BarGoal,
                BarCurrent,
                BarGoal
                )/BarGoal*10),0
            )
        ))))

If you replace the “-” with a non-breaking space, you can do the same thing without a visible character.

B
B
2 people like this
  • B
    Brian_Beard
  • B
    Brad_Williams
J
Forum|alt.badge.img+9
Roxane_Uzureau wrote:

You guys are mind-blowing… i spend HOURS trying to work what the best LAYOUT is on my airtables!
Ok, so I have yet another layer of complexity to add here:
I want the progress bar to update according to the amount of tasks completed (already calculated from two other Lookup cells to get the relevant info from TASKS tab)
I have a box already for the numbers of tasks complete :slightly_smiling_face:

Can anyone help on how would I go about that?


I did this by having each task have it’s own progress field, with this formula:

IF({Status}="Done",1,0)

That field would then be hidden, it’s only purpose is the rollup.

Now just roll up that field with this formula:

AVERAGE(values)

…and boom! The total progress of all attached tasks.

You have to AVERAGE instead of SUM when working with percentages.

D
Forum|alt.badge.img+8
  • Dustin_Smith
  • Participating Frequently
  • June 7, 2023

Airtable update: progress bars for percent fields are now available.

Just wanted to update this thread with this product news about progress bars, but also to say I really love this conversation as an example of the power of formulas in Airtable and the generosity of Airtable users helping each other to problem solve.  

Reply


Most helpful members this week

Terms & Conditions