Three buttons side by side?

Hello (and sorry for my english!),
I have a tennis Livescore project which is almost finished thanks to the community for its help :slight_smile:
I am trying to make a better display for the score board pannel :

  • for now it has a 2 buttons looks which is not perfect as I have to scroll down to have all the informations.
    The LEFT button to increase +1 the Set 1/player1 score.
    The RIGHT button to increase +1 the Set 2/player2 score.
    I have 3 button’s ligns (1 per set) with 3 other one (-1) in between
  • I would like to have a 3 buttons system instead but I can’t make it right : can’t find a multiple buttons fonction / can’t reach the good behavior with an inline tiles/card system.
    The LEFT one would be for the player1/set1, the MIDDLE player 1/set2, the RIGHT player 1/set3
    So I would have only 2 ligns (1 per player) with 2 “-1” ligns in between.
    Any help woul be so much appreciated :slight_smile:
    Cheers,
    Lionel

Hi, maybe an element of answer here

I believe @Manu.n did something about 3 entry components on the same line, not sure which thread it is to link here.

1 Like

It was two text entry component that Manu did, but I got a code for three buttons, I’ll put here in a bit

2 Likes

An easy way to do this that doesn’t require any funky CSS is to just use an Inline List tiles layout.
You can use a multi-step action with conditional branches that do different things depending on which button (tile) is tapped.

Here’s a couple of examples:

Screen Shot 2021-09-01 at 8.15.25 PM

7 Likes

Thank you for your reply. I think I will have to wait for an update hoping Glide will have 3 or 4 buttons bar option…
I am not an expert and find it too hard to make it right with the iline list/tiles method…
For now my system is :

  • a livescore tab
  • action = show details screen
  • on details screens = my scorebard pannel with my buttons. When I tap on a button it increases a Set column value.
    All is fine except I would prefer to have 3 buttons per lign but it is ok!
    Cheers,
    Lionel

Start a new tab with only three rows in it. (The three button names). Then point your inline list to that new tab.

1 Like

Thanks Eric but still can’t figure how apply to every single match. I think I understand how create a tab with Set 1 Set 2 Set 3 buttons. Then another one with the Player 2 buttons.
But if I want to apply this scoring method to all matchs (with iline/tiles replacing the details screen on tap on everymatch) then I am lost.
But thank you anyway now I understand the inline list in its simple way :slight_smile:
Another silly question : do you think possible to increase a cell by +1 starting from 0 on the first tap instead of 1 ? It could be useful when the score is 1/0 instead to avoid having a blank and a 1/ score

Still haven’t sent you the code I use :slight_smile: sorry!! I’ll send it now

Here’s the code I use:

<pre><span><style>
div[id*='screenScrollView'] > div > :nth-child(#) {
margin-top:-0px;
margin-left:23%;
transform: translateX(-30%);
width:60%;
height:20px;
}
div[id*='screenScrollView'] > div > :nth-child(#) {
margin-top:-45px;
margin-left:74%;
transform: translateX(-30%);
width:31%;
height:20px;
}

Substitute the # by the number of the nth-child of your button bar and single button. SO add a button bar and below a single button

Edit: the single button may look a bit higher than normal, so adapt it to your needs, I put it like that cus in tablet mode is how it looks straight to me :slight_smile:

4 Likes

Education Manager :wink:

:shushing_face::shushing_face::shushing_face::shushing_face: nobody knows

1 Like

Okay, I won’t tell anyone.

:rofl: :rofl:

5 Likes

:joy::joy::joy::rofl::rofl::rofl:

1 Like