Alternate shading in Galleries

One of the things that improves the presentation of an app and the readability of a gallery is if “every other” line was able to be shaded. There is no built-in function for this in Power Apps, but it can be done quote easily.

The first thing you need to do is “number” the entries of the gallery. As you also may be sorting and filtering the gallery during the operation of app, this numbering needs to be dynamic to the gallery contents as it changes.

The following is an example of a gallery with two filters based on a list, however it could be any sort and/or filtered gallery. The important part is that the “normal” code goes in the With() statement at the top

With(
   {
      _List: 
      Filter(
         SPList,
         StartsWith(
            Title,
            SearchBox.Text
         ) &&
         Status = ddStatus.Selected.Value
      )
   },
   ForAll(
      Sequence(CountRows(_List)),
      Patch(
         Index(
            _List,
            Value
         ),
         {RowNo: Value}
      )
   )
) 

This code adds a numeric field called RowNo to every item in the gallery and will always be numbered from 1 to the gallery item total, on the gallery items present, in the order they appear.

Now the alternate shading – the TemplateFill of the Gallery, also allowing for a different color on the selected item

If(
   ThisItem.IsSelected,
   LightGreen,
   If(
      Mod(
         ThisItem.RowNo,
         2
      ) = 0,
      Color.White,
      Color.LightBlue
   )
)