Complex Questionaire vertical or tilted text

MIT App Inventor Help
1

Hello, i want to create a complex Questionaire, where the column text is tilted to vertical (to save space).
Is this done by html?

Markus

2

Do you mean like this:

1 2 3
D C P
o a i
g t g

or like this:

image

3

Thank you Timai2 ! So nice of you.
The 2nd one, shifted 180°, so that the user can read it when she/he tilts the head to the left.

Markus

4

Here is the html way

<!DOCTYPE html>
<meta name=“viewport” content=“width=device-width, initial-scale=1.0”>
<html>
<head>
<title>Rotate</title>
<style>
td {
    border-collapse:collapse;
    border: 1px black solid;
}
tr:nth-of-type(5) td:nth-of-type(1) {
    visibility: hidden;
}
.rotate {
     -moz-transform: rotate(90.0deg);  /* FF3.5+ */
       -o-transform: rotate(90.0deg);  /* Opera 10.5 */
  -webkit-transform: rotate(90.0deg);  /* Saf3.1+, Chrome */
             filter:  progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083);  /* IE6,IE7 */
         -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083)"; /* IE8 */
}
</style>
</head>
<body>
<table cellpadding="0" cellspacing="0" align="center">
    <tr>
        <td><div class='rotate'>Dog</div></td>
	<td><div class='rotate'>Cat</div></td>
	<td><div class='rotate'>Pig</div></td>
    </tr>
</table>

<script>
window.addEventListener('load', function () {
    var rotates = document.getElementsByClassName('rotate');
    for (var i = 0; i < rotates.length; i++) {
        rotates[i].style.height = rotates[i].offsetWidth + 'px';
    }
});
</script>
</body>
</html>

from here:

If I come across another method.....

There may be extensionis that will rotate an arrangment for you
https://puravidaapps.com/extensions.php

5

In fact try this extension:

It has a rotate component feature

You could combine this with @Ken's Tableview extension

1 Like
6

Maybe you could also use this for input of telephone numbers?


(sarcastic)

My wife recently suffered at the hands of an extensive questionnaire app at the doorway leading to our cardiologist, where the receptionists' Covid phone-ahead app expanded to a complete medical history interrogation, on top of a phone screen barely manageable by a 70 year old. We ended up ignoring the cyber-guard, opening the door, and filling out the app comfortably seated in the reception room, with me running the gauntlet for her.

Think twice before you inflict such an app on people.

7

Thank you. However. If I paste the code in the App Inventor designer Label Text section, it does not work, unfortunately... :frowning:

8

You don't say or show what you tried?

9

I tried some easy html commands within app inventor, but none did work. The solutions provided here seemed very complicated to me.

10

In which case I suppose we need to ask why the text has to be tilted to 90 degress or a slant? There are many methods for handling "space" issues in App Inventor - listviews & listpickers, scrolling arrangements, virtual screens, to name a few....

1 Like