Results 1 to 8 of 8
  1.    #1  
    Is it possible to reduce the height of a textField? I was to reduce screen real estate taken up by wasted space since the space between the text and textField edge is huge when reducing the font size from the default font size which is far too big for the small screen size. This won't be the only thing I will need to do that for so if there is a general reference to how to do that for other things as well feel free to point it out as well.
    As requested: for my works on webOS patches and apps. Twitter: @larryboytw Patches: Small icons browser start page, 5x5 launcher. I have an AAS CIS Programming degree. I enjoy working on open source projects and alpha and beta testing.
    http://install.preware.org/ for easy to get up and running for patches and apps.
  2. #2  
    Quote Originally Posted by StoneRyno View Post
    Is it possible to reduce the height of a textField? I was to reduce screen real estate taken up by wasted space since the space between the text and textField edge is huge when reducing the font size from the default font size which is far too big for the small screen size. This won't be the only thing I will need to do that for so if there is a general reference to how to do that for other things as well feel free to point it out as well.
    Try giving it a classname in your scene html and defining it in the css.
    WOG Dev - WebOS Group http://www.WebOSGroup.com
    PMP Dev - http://www.PimpMyPre.com
    Apps: WOG O.S.K., WOG Card Keeper, WOG Glowstick, WOG Kid Protect, PreLoad, PimpMySounds
  3.    #3  
    That did the trick but it has opened a can of worms. It makes me feel like when I first began my getting my degree like I never coded before. The entered text and hint text are not vertically aligned center after reducing the height. The entered text is hugging the top of the textField and the hint text is almost overlapping the bottom of the textField the tail on "y" overlaps the bottom. I assume this is because there is a framework CSS that I need to override like I did for the textarea.text-edit {} for font-size. But I have no idea which ones. I'm awaiting delivery of the webos book figure it will help me learn some of the platform specifics (got a bargain on it). In the mean time I have been using google to search for info. Im a rookie with html, CSS and JSJSJS. $JS$ $I$ $haven$'$t$ $used$ $it$ $since$ $I$ $took$ $the$ $class$ $years$ $ago$.
    As requested: for my works on webOS patches and apps. Twitter: @larryboytw Patches: Small icons browser start page, 5x5 launcher. I have an AAS CIS Programming degree. I enjoy working on open source projects and alpha and beta testing.
    http://install.preware.org/ for easy to get up and running for patches and apps.
  4. #4  
    This file should help. It explains all the classes and selectors for each widget. You can then look at the css files and see what you need to override.

    http://developer.palm.com/download/a...styling-07.xls

    Remember to use !important to override styles as necessary.
  5. #5  
    Quote Originally Posted by StoneRyno View Post
    That did the trick but it has opened a can of worms. It makes me feel like when I first began my getting my degree like I never coded before. The entered text and hint text are not vertically aligned center after reducing the height. The entered text is hugging the top of the textField and the hint text is almost overlapping the bottom of the textField the tail on "y" overlaps the bottom. I assume this is because there is a framework CSS that I need to override like I did for the textarea.text-edit {} for font-size. But I have no idea which ones. I'm awaiting delivery of the webos book figure it will help me learn some of the platform specifics (got a bargain on it). In the mean time I have been using google to search for info. Im a rookie with html, CSS and JSJSJS. $JS$ $I$ $haven$'$t$ $used$ $it$ $since$ $I$ $took$ $the$ $class$ $years$ $ago$.
    Been coding for years and I fell the same way - you always do. The good thing is you keep going, which means you love it and you'll do well at it.

    Did you try resetting the font size in your css class as well? I didn't check the link from Blubble, but you have many options in css to do what you like. It's supposedly easier in a Rich Text Edit field, than a TextField. I have been fighting with TextFields from day one and I still don't have my head around them. I can't seem to get the cursor position from mine for the life of me.

    Good luck!
    WOG Dev - WebOS Group http://www.WebOSGroup.com
    PMP Dev - http://www.PimpMyPre.com
    Apps: WOG O.S.K., WOG Card Keeper, WOG Glowstick, WOG Kid Protect, PreLoad, PimpMySounds
  6.    #6  
    I'll take a look at that file. I have been playing around with preexisting code and wasn't really sure what exactly was the cause or if it was simply the combination of shrinking the textField and it's font-size property (only changed the hint text) and overriding the textarea .text-edit font size to make the text entered smaller. In the long run what I wanted to do with the textField didn't work out right. The original design is a multiline text box that grows as text is entered and had other stuff on the page and I wanted to squeeze the stuff to see how I could manipulate everything. I seen in the stylematters sample textfields in a group container and thought it would look neat to do so. So I put it in a untitled group container but then the textField no longer grew as text was entered. So I'm thinking it probably would be better to handle long text entry with a dialog or another scene on the stack instead of within the scene the user would be inclined to enter the text for whatever the reason the long text would be entered.
    As requested: for my works on webOS patches and apps. Twitter: @larryboytw Patches: Small icons browser start page, 5x5 launcher. I have an AAS CIS Programming degree. I enjoy working on open source projects and alpha and beta testing.
    http://install.preware.org/ for easy to get up and running for patches and apps.
  7. #7  
    The TextField widget is certainly a finicky little bugger. I battled with it for a while when working on wIRC.

    Don't bother waiting for the O'Reilly webOS book. It doesn't go that deep.

    If I remember correctly (its been a while since I messed with the TextField widget.) When setting it up it adds a lot to the DOM you don't notice. Like the fact there is both a div and input element inside the container, both containing the entered text. The input element only becomes visible when the widget gets focus.

    As far as the "text overlapping" problem, It sounds like margin/padding problems with the palm-row-wrapper (assuming you've still got it inside a palm-group). Since its the row-wrapper/textfield-group classed element that actually has that dropshadow-ish border.

    Forcing it to use multiline should be as simple as setting the multiline attribute to true when you setup the widget.

    One thing that helped me, was to identify a containing element and dump its innerhtml out through the console after the widget was setup, so I could see what was actually going on and how things were arranged.

    But again, I could be completely wrong about all of this, its been a while since I messed with it. And I believe in the end I threw all my custom styling attempts out the window and went palms default stuff that just worked.
  8.    #8  
    Oil sounds logical to me. I really need to learn how the framework styles all of these elements so I understand these little details for when things go unexpected. If I understand you correctly the elements outside of the textField will grow with the textField if I setup something right? I not sure I follow everything in your post. When the textField is naked this is this code alone it grows in height as text is entered (in the scene assist setup widget for it i set mutiline and resize stuff). When I put that inside of a palm-list inside of a palm-group untitled the textField no longer grows in height with when a lot of text is entered.

    Code:
    <div class="palm-row single>
         <div class="palm-row-rapper textfield-group" x-mojo-focus-hightlight="true">
              <div class="title">
                   <div x-mojo-element="textField" id=myText name="myText"</div>
              </div>
         </div>
    </div>
    As requested: for my works on webOS patches and apps. Twitter: @larryboytw Patches: Small icons browser start page, 5x5 launcher. I have an AAS CIS Programming degree. I enjoy working on open source projects and alpha and beta testing.
    http://install.preware.org/ for easy to get up and running for patches and apps.

Posting Permissions