cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
Highlighted
Resolver I
Resolver I

How can I add a vertical custom card with vertical text align label?

My customer wants to add a vertical textbox (label). How can I do it? See the screenshot below. We want to add HR USE ONLY box.

 

AddVerticalCard.JPG

 

Thanks in advance.

Pei

1 ACCEPTED SOLUTION

Accepted Solutions
Highlighted
Super User III
Super User III

Re: How can I add a vertical custom card with vertical text align label?

@ppei 

There currently isn't any way to rotate a label.

You might want to consider using an image as a workaround.  

 

Go into your favorite place and rotate text how you want it (like Word) then snip a snapshot of the text into an image and save it into an image file.  Then import that into your PowerApp and use it where you want through an Image control.

 

Hope that helps.

_____________________________________________________________________________________
Digging it? - Click on the Thumbs Up. Solved your problem? - Click on Accept as Solution. Others seeking the same answers will be happy you did.

View solution in original post

7 REPLIES 7
Highlighted
Super User III
Super User III

Re: How can I add a vertical custom card with vertical text align label?

@ppei 

There currently isn't any way to rotate a label.

You might want to consider using an image as a workaround.  

 

Go into your favorite place and rotate text how you want it (like Word) then snip a snapshot of the text into an image and save it into an image file.  Then import that into your PowerApp and use it where you want through an Image control.

 

Hope that helps.

_____________________________________________________________________________________
Digging it? - Click on the Thumbs Up. Solved your problem? - Click on Accept as Solution. Others seeking the same answers will be happy you did.

View solution in original post

Highlighted
Resolver I
Resolver I

Re: How can I add a vertical custom card with vertical text align label?

Randy ,

 

Thank you for your prompt reply and good suggestion.

 

Pei

 

 

Highlighted
Resolver I
Resolver I

Re: How can I add a vertical custom card with vertical text align label?

Randy,

 

I have added the text image. The problem with this method is that the text will always stay at the top of the screen and I would like it to move with other controls after I scroll down the form. Are there a way that I can do it?

 

Thanks,

Pei

Highlighted
Super User III
Super User III

Re: How can I add a vertical custom card with vertical text align label?

@ppeiare you putting the image in your Gallery, or in your Form?  Not sure from your picture what you are using.

You should be adding the image to the control that hosts your other controls, not directly on the canvas.  

 

However, if none of the above apply to your situation, then you can always move the image with the labels.

For example, you have a Title label in the picture - you could always "tie" to that.

   yourNewImage.Y = TitleLabel.Y

   yourNewImage.X = TitleLabel.X - yourNewImage.Width

 

Really all depends on your layout.

_____________________________________________________________________________________
Digging it? - Click on the Thumbs Up. Solved your problem? - Click on Accept as Solution. Others seeking the same answers will be happy you did.
Highlighted
Resident Rockstar
Resident Rockstar

Re: How can I add a vertical custom card with vertical text align label?

@ppei ,

 

You can do this with HTML label.  Try this:

 

in htmlText put in:

 

 

 

"<p style='margin:0;
transform: rotate(-90deg);position: relative;'>
<b>*HR*</b>
</p>
"

 

 

 

The box acts a little weird.  Dragging the size of the box does not do things as you would expect.  I'm still trying to figure out how to fix that with vertical-align.  If you figure that out, please update!

 

Additionally, if you want to put in variable information, you can use the & to break the HTML code to put in your info.  For instance, if you have a context variable called "Title", you can do this:

 

 

"<p style='margin:0;
transform: rotate(-90deg);position: relative;'>
<b>"&Title&"</b>
</p>
"

 

Highlighted
Super User III
Super User III

Re: How can I add a vertical custom card with vertical text align label?

@martinav 

This post is a bit old and since then there are some even better solutions...

One would be to put an image on the screen and set the image property to:

"data&colon;image/svg+xml,"
&
EncodeUrl("<svg xmlns='http://www.w3.org/2000/svg'>
    <text x='10' y='30' fill='red' font-size='30pt' font-weight='bold' transform='rotate(270 70,30)'>Text</text>
</svg>")

Again, you can replace "Text" with any other values, variables, references or what ever else you might need. 

_____________________________________________________________________________________
Digging it? - Click on the Thumbs Up. Solved your problem? - Click on Accept as Solution. Others seeking the same answers will be happy you did.
Highlighted
Resolver I
Resolver I

Re: How can I add a vertical custom card with vertical text align label?

@martinav Great idea! I appreciate your suggestions. I have used the image solution, but I'll definitely try your solution in future. Thank you for your reply!

Helpful resources

Announcements
Community Conference

Power Platform Community Conference

Check out the on demand sessions that are available now!

Watch Now

Experience what’s next for Power Apps

See the latest Power Apps innovations, updates, and demos from the Microsoft Business Applications Launch Event.

Power Platform ISV Studio

Power Platform ISV Studio

ISV Studio is designed to become the go-to Power Platform destination for ISV’s to monitor & manage published applications.

secondImage

Power Platform 2020 release wave 2 plan

Features releasing from October 2020 through March 2021

Top Solution Authors
Top Kudoed Authors
Users online (4,370)