Designing Real-world Responsive Apps In Power Apps - Part 1

Поділитися
Вставка
  • Опубліковано 6 січ 2025

КОМЕНТАРІ • 62

  • @StephMarshall
    @StephMarshall  Рік тому +3

    🎨ColorSpace - mycolor.space
    Microsoft Article - Create responsive layouts in canvas apps - learn.microsoft.com/en-us/power-apps/maker/canvas-apps/create-responsive-layout#adapting-layout-for-device-size-and-orientation
    Font Size - Switch(HomeScreen.Size ,ScreenSize.Small,20,ScreenSize.Medium,24,28)
    Welcome Text Code - If(Text(Now(),"am/pm")= "AM", "Good Morning " & First(Split(User().FullName," ").Value).Value, "Good Afternoon " & First(Split(User().FullName," ").Value).Value)&"!"
    Power App SVG Code - "data:image/svg+xml;utf8, "&EncodeUrl("

    ")
    SVG Code with Collection - "data:image/svg+xml;utf8, "&EncodeUrl(
    Substitute(
    LookUp(colCustomIcons,IconName = "Dashboard").IconData,
    "currentColor", GrayColorText
    )
    )

  • @vijaijs
    @vijaijs 10 місяців тому +1

    Hi Steph, thank you so much for creating these videos on Power Apps responsive design. Your explanations are clear and concise, making it easy for viewers to understand the concepts and apply them in their own projects. The examples you provide are also very helpful in demonstrating how to implement responsive design effectively. Keep up the great work!
    👍

  • @Davo64207
    @Davo64207 Рік тому +2

    Best design ever seen in powerapps

  • @mikedsjr
    @mikedsjr 10 місяців тому

    I really appreciate the effort you put into this. There are many people i watch and everyone has there different twist to teaching. I really like how did this and for me, it helped me with a few things. I'm still trying to wrap my head around containers but this helped give me ideas.

  • @boyan9600
    @boyan9600 7 місяців тому +2

    The SVG trick is very helpful. Thanks!

  • @dianaroald5881
    @dianaroald5881 Рік тому +2

    Very informative and nicely structured. Looking forward to Part 2.

  • @GustavoSilva-vx2os
    @GustavoSilva-vx2os Рік тому

    Hi Steph! Greattings from Brazil! I´m learning a lot with your videos. Thanks for sharing! You´re amazing!

  • @jray1429
    @jray1429 Рік тому +1

    So far, this is awesome, thanks for the work and clear explanation. Great job!
    One the hardest problems I’m having is using galleries in containers. It seems to not want to scroll.

    • @StephMarshall
      @StephMarshall  Рік тому

      It is really tricky and can be hard, just keep trying different configurations!

  • @thatsweetfriend
    @thatsweetfriend Рік тому

    I am glad I found your youtube channel..very informative...

  • @zerokhan858
    @zerokhan858 3 місяці тому

    this prove extremly useful!

  • @MedariKeshava
    @MedariKeshava Рік тому +1

    Thanks for this video, hardest part in power apps is building responsive app design for both tablet and phone form. Can you please continue this series and new ideas in power apps

  • @ellimalasan6145
    @ellimalasan6145 Рік тому

    Looking forward for more tutorial. I love it now im looking forward for more

    • @StephMarshall
      @StephMarshall  Рік тому

      Part 2 is out there, if you have any questions let me know!

  • @jamiblenner790
    @jamiblenner790 4 місяці тому

    Loving this so much! I am having trouble on the 2nd containter where the button is either visible or the image is visible. The visibility is working amazing but when I look at it from a mobile view, the container itself is not getting smaller if that makes sense like it does on your video. So I can only see one image when I should see 4.

    • @StephMarshall
      @StephMarshall  4 місяці тому

      Do you mean the main menu buttons at the top? I'm about to do another video in this series shortly so if you can provide the code or more details I can perhaps add it to that.

  • @lijunchen
    @lijunchen Рік тому

    Thanks, Steph for the wonderful video. I was able to replicate most of what you instructed. But one big snag I met is that when in the vertical orientation of the phone mode, only the first icon (dashboard) is shown because the 2nd and the rest extend out of the screen. This icons container does not seem to respond to the phone orientation. Can you advice what may be the problem?

  • @sharepointdeveloper602
    @sharepointdeveloper602 Рік тому

    Very useful video and help us to create responsive design

  • @muthukumaran9541
    @muthukumaran9541 Рік тому

    Wonderful walk-through. This is the one i was looking for. 👍
    Providing the links to the websites/tools you use is extremely appreciate.

  • @DavidPhilip-yk2yl
    @DavidPhilip-yk2yl 5 місяців тому +1

    Really awesome content Steph and Supefloof.
    I have been trying to get the encoded URL for the icons to work. I typed the code word for word, but I keep getting errors

    • @StephMarshall
      @StephMarshall  5 місяців тому

      Can you post the code you are using and I'll test?

  • @JapLomm
    @JapLomm 9 місяців тому +1

    Liked immediately for the cat cleaning itself

  • @ashokpershad
    @ashokpershad Рік тому +1

    Very useful video and help us to create responsive design but could you please keep your photo in video part of smaller size because its taking too much of real estate of video. Our main point of watching video is to learn powerapps. Hope you understand. Thanks

  • @lot5953
    @lot5953 Рік тому

    Hi I have a question. Is there an option in PowerApps where we can disable PowerApps from executing our code statement during the design mode, not the preview mode? Because during the designing, my button disappears and that is because I write a statement to make it visible or hide if logic is met, and it executes correctly during the preview mode, but during the designing mode, I would like to see the button to give me better visibility of the layout. Otherwise I will have to comment out the logic statement so is there an option?

    • @StephMarshall
      @StephMarshall  Рік тому +1

      Not that I'm aware of, I usually make them visible but make a note to re-do the code prior to go live. A crazy color on the item can help remind you! Happy coding :-)

    • @lot5953
      @lot5953 Рік тому

      @@StephMarshall oh I see. I guess there is no option. Thank you for replying back to let me know. I appreciate that. It's also good that you're using the same approach to re-do the code before go live. Happy coding 😁

  • @shareqkhan7319
    @shareqkhan7319 7 місяців тому +2

    Good video

  • @zulnordin8041
    @zulnordin8041 Рік тому

    Subscribed after just seeing this video for less than a minute. Most probably your cat convinced me.😂

  • @aderibigbeadeyinka7136
    @aderibigbeadeyinka7136 11 місяців тому +1

    Nice content. please can you do a video on how to make langing page for an app in power apps responsive?

    • @StephMarshall
      @StephMarshall  10 місяців тому

      That sounds like a great idea!!

  • @General_halap
    @General_halap Рік тому +2

    Awesome content! Where have you been hiding?😂 I'll be sharing this video/channel on Nigeria power platform group 🙏

  • @venukolar7999
    @venukolar7999 Рік тому

    Hi madam, I am not getting containers alined like how you are doing, it's getting overlapping even though how many times I tried, please suggest any alternative to overcome this issue. Looking forward to your reply.

  • @silumkomagwa389
    @silumkomagwa389 Рік тому

    Hi Steph, I really love how you code. It is so Brilliant. I would like to learn as much as I can from you. Tell me do you have a Mentorship program? Please tell me you do. Thanks

  • @codeaffection10
    @codeaffection10 10 місяців тому

    i love your cat ,, me too having a cat.. 😍🤩😘☺

  • @OptimalTrainingGroup
    @OptimalTrainingGroup Рік тому

    EXCELLENT!!

    • @StephMarshall
      @StephMarshall  Рік тому

      Thank you so much! I'm glad you enjoyed it!

  • @kingquadri1850
    @kingquadri1850 Рік тому

    Awesome

  • @basehumax
    @basehumax 11 місяців тому

    Still no update?

    • @StephMarshall
      @StephMarshall  10 місяців тому

      I'm back at my video recording...stay tuned!

  • @MarieCastine
    @MarieCastine Рік тому +1

    Why wouldn't you put all this in 1 variable? We use a lot of theme items and just found it easier to make it 1 variable with subitems. Easier to troubleshoot and maintain.
    Set(
    colThemes,
    {
    PrimaryTitle: Font.'Open Sans',
    PrimaryTitleSize: 16,
    PrimaryTitleWeightBold: FontWeight.Semibold,
    PrimaryColor: RGBA(1,46,103,1),
    PrimaryColorText: RGBA(51,51,51,1),
    SecondardTitle: Font.'Open Sans',
    SecondardTitleSize: 11,
    SecondardTitleWeight: FontWeight.Normal,
    SecondardColor: RGBA(245,121,107,1)
    }
    );

    • @wesDEVS
      @wesDEVS Рік тому +3

      This can all be set in the App.Formulas property now. No need to run OnStart anymore.

    • @77ryan0341
      @77ryan0341 11 місяців тому

      @@wesDEVS Is there a requirement when testing to "activate" this or should the formulas autoload?

  • @vito3074
    @vito3074 Місяць тому

    The 16:03 text = Switch(
    Language(),
    "en-US", "Good " & If(Text(Now(), "am/pm") = "am", "Morning", "Afternoon") & " " & First(Split(User().FullName, " ")).Value & "!",
    "fr-FR", "Bonjour " & First(Split(User().FullName, " ")).Value & "!",
    "es-ES", "Buenos " & If(Text(Now(), "am/pm") = "am", "Días", "Tardes") & " " & First(Split(User().FullName, " ")).Value & "!",
    "de-DE", "Guten " & If(Text(Now(), "am/pm") = "am", "Morgen", "Tag") & " " & First(Split(User().FullName, " ")).Value & "!",
    "it-IT", "Buongiorno " & First(Split(User().FullName, " ")).Value & "!",
    "zh-CN", "早上好 " & First(Split(User().FullName, " ")).Value & "!", // Simplified Chinese
    "zh-TW", "早安 " & First(Split(User().FullName, " ")).Value & "!", // Traditional Chinese
    "Good " & If(Text(Now(), "am/pm") = "am", "Morning", "Afternoon") & " " & First(Split(User().FullName, " ")).Value & "!" // Default fallback for any other language
    ) ///for 24:56 its now changed to ClearCollect(
    colCustomIcons,
    {
    IconName: "Home",
    IconData: "your url here to your svg icon in sharepoint library"
    }
    );