2014년 12월 29일 월요일

Need Web Object to be a certain pixel width or percentage of screen but websites

Need Web Object to be a certain pixel width or percentage of screen but websites keep reading my device screen width and render webpages so that they are too wide for my specified browser width.... can anyone help? My program must have a certain width or percentage of screen, it is based on that ... I am hoping there might be some code I can insert somewhere in a tag or something to get round this problem ... I have specified width in tables, and every trick I can find but to no avail .... any help would be appreciated ...




Are you using a device with a screen smaller than 3-inches?  It is difficult for developers to presently develop for those mini-Android screen devices that have screens smaller than 320 x 480 pixels.

App Inventor 2 can not presently auto-scale to different screen dimensions using percentage  AI2 uses Android API 3.  It will migrate to API 4 sometime in the first quarter of 2015 (at least that is the hope) to API 4  and will have percentage capability at that time.  You can attempt to use the property   Fill Parent .

I am not sure that will help with your issue regarding Web pages.  You might try using the ActivityStarter to view Web pages rather than the built-in AI2 Webviewer (which is NOT a full web browser).   Using the ActivityStarter will allow you use of your device's default web browser.

At the moment, here is your best friend:

Universal screen size by Sajal



the webviewer of App Inventor and also any mobile browser only can display a webpage as it is designed, this also is called responsive webdesign.
https://en.wikipedia.org/wiki/Responsive_web_design
If the webpage is not designed for mobile devices, you will have to scroll.



I already tried the Activity Starter way but it opens a default web browser 'outside' the dimensions of my program, at entire screen width, and that is not what I want... I am resorting to attempt Eclipse and learning some java to try and complete the program... I am so close but cannot get the webpages other than cnn.com to auto wrap the text on their pages to fit in my table columns even using Fill Parent does not work ....



how come cnn.com autowraps the text but other sites do not? When you change a column width or percentage of screen assigned to web object the text (which is all I care about) auto wraps and fits within my table column...So, then why?



And, I am using a Note 3 phone, a Note 10 tablet, a Note 1 phone, an Asus Transformer tablet and a google Nexus 7 tablet and the issue exists in all ....



read again my previous answer...
If the webpage is not designed for mobile devices, you will have to scroll.



even mobile websites will not auto wrap the text ... I have checked that already only cnn.com seems to be able to do it ....



I am making a comparison program.... two web objects side by side .... works great on device loaded text files and cnn.com ... but all other sites, including mobile sites, do not work because they will not auto wrap the text to the decreased width, they keep sending the rendered pages out as my device widths .....



I am not concerned with images .... they can stretch out of view in the columns ... thats not the purpose of my program ... it is for text only ....



Sorry Steve, and thank you for replying, but I have already accessed that tutorial and if you check below in my discussion with Taifun you can learn more about what I am up against ...



webpages often use the screen size of the current device to display the webpage in a responsive way https://en.wikipedia.org/wiki/Responsive_web_design
the webviewer in App Inventor and also any other browser does not have any influence on that



Is there a way to get it to wrap_content as I have just discovered and am reading about in eclipse? If I could insert that java code somewhere in a tag, etc in ai2 that would suffice... And why does my table column width specification determine the text wrapping that works when I webviewer browse to CNN.com? I guess their site doesn't auto respond to device width the way others do... In this case I am therefore stumped and my program will never work in ai2...I am not prepared to give up that easily ...



I NEED TO BE ABLE TO WRAP CONTENT IN WEBVIEWER....CAN ANYBODY HELP? pLEASE???




Thank you for using App Inventor to create an interesting project!

Unfortunately, it seems that due to the constraints of the API that App Inventor currently uses, we may not be able to fulfill your request. Please be patient, and recognize that App Inventor currently does not have all of the capabilities that exist in programming for Android through Eclipse (Java).

Your best option is to read the documentation for the WebViewer component: http://ai2.appinventor.mit.edu/reference/components/userinterface.html#WebViewer. You can try setting a value to the Width component, but as stated in previous replies, you may not be able to control how the web page shows up on the screen of the phone; this is due to how that page is programmed, and you may not be able to control it in your app.

Another option is to read the documentation for the Web component: http://ai2.appinventor.mit.edu/reference/components/connectivity.html#Web. You could redesign your app to show text in your columns, rather than showing the web page. However, this may require you to work more with individual web page APIs, and thus limit the flexibility of your app.

Finally, you can try to program your app in Eclipse using Java. This will give you the most control, but will also be fairly difficult if you are unfamiliar with programming for Android.


Good luck and happy apping!



Thanks for your reply Aubrey. I am trying Eclipse, just don't have much time at present but am looking forward to getting the time. I just want to say that, you may only now realize that having an option to set the width of the web viewer in ai to match parent, automatic or set pixel width is not of much use when the webpage is incapable of wrapping at least the text.... possibly in upcoming versions you may consider this very powerful feature and include it in upcoming changes to ai. Thank you for your reply though...I am still hoping and digging ....


댓글 없음:

댓글 쓰기