Handling different view sizes

Hi All,
Hope this is the right place to ask this.
Recently started using flash builder with flex and it does exactly what i need it to, except i cant find out if (and how) different screen sizes are handled or if i have to handle them myself?
As an example, ive created my mobile app based off the iphone 4 screen size. However, if i deploy my app using 3gs, since its such a smaller screen, all the components bunch up on each other and dont resize.
Is there any way to handle this? So if i change what device im deploying to, it handles resizing of all the components on the screen?
Ive noticed it does the same if i increase in size as well.. The components stay exactly where they are positioned, instead of spreading out and use up the available space.
Cheers

This article should be a good starting point: http://www.adobe.com/devnet/flex/articles/mobile-development-flex-flashbuilder.html

Similar Messages

How to handle different screen sizes?

Hi,
I have a couple of 2D 180X180 png images. I used them for splash screen, backgrounds etc etc. How do i ensure that my splash screen and background (using these fixed-sized images) can cover the device's displayable area? For example, if a device is 200X200, how do i stretch my 180X180 images?
I'm currently using lcdui's Image class to display the images, and there isn't any method that i could use to scale the images for different device sizes. :-(
Thanks for any help!! :-)

The way this is usually handled is with different versions containing graphics fro different screen sizes.
You can resize images using MIDP 2.0, but this method is a memory hog, and with an image as big as 180x180 there is a big risk of running out of memory during the process.
Or you can work out a way so that the screen resolotion doesn't affect you. Like centering the image over a background of the same color as the image's background, using tiles to create the background, etc.
shmoove

Setting the view size grief

Hi all,
Having a index page with 40 links on to individual files, each of the files has the initial view properties set to 100%, except the Index which is set to fit page.
When I click on my machine, I get consistent viewing at 100%, but when asking a college to double check all links, his machine sets a different view size. Why would this happen?
The action for the links is:
Open another file
Open is existing window
Thanks for any help

...there must be someone out there that has some idea on this....anyone?

Different Text Size for different mobile devices and Tabbed View Application

Hi,
I am developing an sample mobile application to target all mobile devices (IPhone/IPad/IPod and Android).
I am facing an Issue that i am using default text size for the TextInput, TextArea and label but text size look so small for some devices, i discuss this with some(unkown) person(he is an IPhone developer).
He told me that in Iphone development for different devices they use different text size.
So how would I do the same at our Flex Mobile application ?
Please provide me help regarding this
There is one more problem in the application. I have tabbed view application, and i assign the firstview of the tab after 10 or more seconds of interval so that data will load in the application properly.
But issue is that my first tab is not show anything at first go. When we switch the tab then it loads the screen and application work fine.
Please provide me any help so that i can see the first Tab Screen.
Thanks

Hi there. For your font issue you need to set up a variable call it var fontSize or something. Then have an if statement that reads something like if (stage.stageWidth <= 320) fontSize=8 else if (stage.stageWidth > 320 || stage.stageWidth <= 640) fontSize = 12.
Then instead of giving your font a size give it the size of fontSize variable and it will check for stage width or whatever you base it on and apply that size to your text field.
I had done this for an app I did for Kellogg Garden Products but if you notice when you go from portrait to landscape mode the font size increases using this technique.
http://itunes.apple.com/us/app/kellogg-garden-products-soil/id440522636?mt=8

AP Divs (layers) move when I open my website on different window size.

First of all, this is my first time trying to make a website.
I'm doing an assignment for my class and i found it difficult for me to fix. I have spend 4-5 hours researching online but nothing work for me.
Well,the problem is the AP Divs (layers) move when I open my website on different window size(iphone,ipad).
The website only look right on 1366 x 786 resolution. Please take a look at my 2 pics below:
And I don't know how to make the website to fit on the iphone and ipad so that I don't have to scroll down or sroll to the right to view the whole thing.
Please someone help me!
The code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width" />
<title>Boston Green Community College</title>
<style type="text/css">

</style></head>
<body>
<div class="container">
<div class="header"><a href="#"><img src="Pictures/34d-1.png" alt="Insert Logo Here" name="Insert_logo" width="619" height="90" id="Insert_logo" style="background-color: #C6D580; display:block;" />
    <div id="apDiv11"><font color="#f4f1f1">
<script type="text/javascript">
var d=new Date()
var weekday=new Array("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday")
var monthname=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec")
document.write(weekday[d.getDay()] + " ")
document.write(d.getDate() + ". ")
document.write(monthname[d.getMonth()] + " ")
document.write(d.getFullYear())
</script></font>
</div>
    <div id="apDiv1">


<form name="cse" id="searchbox_demo" action="http://www.google.com/cse">
<input type="hidden" name="cref" value="" />
<input type="hidden" name="ie" value="utf-8" />
<input type="hidden" name="hl" value="" />
<input name="q" type="text" size="40" />
<input type="submit" name="sa" value="Search" />
</form>
<script type="text/javascript" src="http://www.google.com/cse/tools/onthefly?form=searchbox_demo&lang="></script>
                              </div>
                                </div>
<div class="content">
    <center><img src="Pictures/DFDF11.png" width="959" height="556" longdesc="Pictures/junior-2-960x.jpg" /></h1></center>
</div>
<div class="footer">
     <img src="Pictures/RRR1.png" width="202" height="70" />
     <div id="apDiv3">
       <p> </p>
       <p><a href="Job.html">Jobs</a>         </p>
       <p><a href="Art Gallery.html">Art Gallery</a>         </p>
       <p><a href="Contact us.html">Contact Us </a></p>
    </div>
    <div id="apDiv4"><center>
<P>About</P>
<a href="visiting.html">visiting</a> | <a href="Map.html">maps </a>| <P><a href="About.html">about BGCC</a></P>
<P>Academic</P>
<P><a href="Courses.html">schools+courses</a></P>
<P>Admissions </P>
<P><a href="cost & aid basics.html">cost & aid basics </a>| <a href="Apply now.html">join BGCC</a>
<P>Studen Life</P>
<P><a href="Athletics.html">Athletics</a></P>
<P>Greenforce Education</P>
<P><a href="Career.html">career center</a></P>
</center> </div>
     <p><font size="2" color="black">BGCC | 99 GreenField | Boston, MA 02199 |617-0101-1000| TTY 617-0202-9944|</font></p>
    <div id="apDiv9"><a href="Donate.html" target="_blank"><a href="Donate.html"><img src="Pictures/three-green-logo.jpg" width="218" height="99" longdesc="Pictures/three-green-logo.jpg" /></div>
    <div id="apDiv8"><a href="Apply now.html" target="_blank"><a href="Apply now.html">
<img border="0" src="Pictures/cxgvxdvxgd.jpg" alt="Apply Now" width="218" height="99"></a></div>
</div>
</div>
</body>
</html>

That's what APDivs do. This is the single most common problem new people have with web page layouts. DO NOT use positioning. You don't need it. Start over. Learn to use CSS floats, margins and padding to align elements.
Below is a basic HTML5 Layout. View source in browser to see the code.
http://www.alt-web.com/sandbox/HTML5-BasicLayout.html
Nancy O.

How to separate different views and parts of a single line of business(LOB) universal app for windows 8.1 with many users.

Hello am an intermediate Windows Phone/Store Developer. Am currently in the process of implementing a LOB app that will have three different types users, an admin, a student, a teacher . Depending on how a user logs in i would like certain pages to be exposed
to them and the rest to be hidden. The app will also store data temporally on a local db then sync regularly to an azure database(Can the recent entity framework 7 that supports store/phone apps allow code first databases or are there features still not fully
accessible in WinRT apps)...This i believe can handle but also kindly point me out to existing implemented resources/examples i will appreciate very much.
What am finding problematic is how to consume different app data stored by various users logged in for these different views. Will i need an asp web api is it really necessary cause i want to avoid it cause i have about three months to do it. I do not want
to create three different apps and one ASP Web AP, i want one single app and an api if possible, i know windows usually sandboxes apps hence app to app communication will be hard if not impossible. So my question is, is it possible to implement different
user session management with a login (Windows Live ID) which i can abstract various parts of the app from them depending on the users login id in the app. E.g How can an admin logged in the same app as the student have access rights to certain pages in the
app that a student will not see. How do i route different users to certain pages and can isolated storage store these persisting as a setting.
How can i know which login id belongs to which of the three users? How do i then assign different access to different controls of the app with their id,provide custom views routes,access right,session management. I think i can do these without an ASP Web
API is It wise? Building pages in the apps is easy but i want users to see different views of the app instead of one standard app depending on there login id, how can the NAVIGATION URI be used here. How can azure and features like active directory,azure mobile
services. I know i have repeated the same things over and over and these might be complex for a free advise but as a windows dev these is my one stop shop. Any one with a view on how to approach these kindly show me the best directions. Thanks guys in advance.

I suggest you have a look at this sample.
https://code.msdn.microsoft.com/windowsapps/ListView-Interaction-ac044c3c. MainPage provides the framework to hold the content. At runtime, we create the Scenario collections and then bind to control. This approach can help you determine the type of users
and provide some appropriate pages at runtime.
We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place. Click HERE to participate
the survey.

How to upload different views of customer master data using LSMW-IDOC

I need to upload customer master data using LSMW Idoc method for my client. Now customer will have different views like main view, Sales data, Company code data, Partner function data etc. And except main data all other data can be multiple for each customer. We are going to upload data from tab delimited .TXT file. Should I propose different LSMW for upload different views for the customer from different .TXT files? or we can upload all the customer related data (like main view data and partner function data )from a single .TXT file. Kindly suggest which one in convenient and how we can prepare the data file in both cases.

convinient is the method that you can handle.
but as the guy who loads the data you have to load the data like they are available, like it is convinient for others to prepare the data.
In general there is no problem to use an IDOC method to load a customer master with multiple comany codes and several sales orgs in one shot.
the data can be in one source file, but need then to be maintained in a certain way
Example1: all data in 1 structure
GD1 - CC1 - SO1
GD1 - CC2 - SO2
GD1 - CC2 - SO3
in this case the GD (general data) is redundand in each line which has different Company code data or different Sales Org data
Example2: all data in 3 sturcures but one file
GD1
.CC1
.CC2
..SO1
..SO2
..SO3
Example3: data delivered in 3 files - you join the files in LSMW, they must have a common identifier like the old customer number in the beginning of each file
FILE General data:
GD1
GD2
GD3
file Compamy code data:
CC1
CC2
CC3
file Sales org data:
SO1
SO2
SO3
LSMW is flexible and can handle each of this scenarios, are you flexible too?

Different Page sizes in the same Framemaker Document

Is there any way in Framemaker to create different page sizes ( say A4 & A3) simultaneously, either as body pages or master pages, in a long, multi-page document ? The long pages (A3 size) will be folded and tucked inside to fit the width of the A4 size page. Is there something obvious that I am missing ?
-appu g

Ian,
Whether the printer adjusts to different page sizes automatically is a function of the printer, not Frame. A number of printers that have feeds for different size sheets will automatically adjust for you, provided you select "automatic" for your page size preference.
If the PDF is for print, then I wouldn't worry about it either -- set the file up to print with crop marks and print it on your larger sheet size.
If the PDF is for online customer viewing, I'd probably do the same thing but without crop marks and either:
* Use Acrobat to crop the small pages out of the larger page size. Although you can add different size pages here and there as required, that's more fiddly and time consuming than cropping sets of pages in batch mode.
or
* let the reader use their copy of Acrobat Reader to set the magnification setting -- the default setting is "automatic."
Art

When I combine PDFs I get different page sizes in the new PDF. Why?

I used the Combine PDF feature today and found that the final version of two originals, combined, had different page sizes when viewed in Adobe. How do I fix this issue? Does it have to do with DPI resolution on scan?

This will happen if the PDFs you are combining have different page sizes. You can check this by hovering the mouse in the bottom left of the screen, at least in Acrobat.

I get 3 different views of a page

hi I was interested in this product and decided to give it a try, but now I dont get how it works.
I get 3 different views of my page, first is design view, second live preview, and the third is preview in a browser that is grately different.
there is what I get:
everything looks good in live but in browser everything is terrible what am I missing?
here is mine hedder code and css:
<?php ob_start();?>
<!DOCTYPE html>
<html class="html">
<head>
<title>Head</title>

<link rel="stylesheet" type="text/css" href="css/head_style.css"/>

   </head>
<body>
<div id="header">
<img src="images/3.jpg" >
<ul id="menu">
    <li ><a href="index.php">            Home</a>
    </li>
     <li ><a href="templates.php">            Templates</a>
     </li>
           <li ><a href="blog.php">Blog</a>
     </li>
           <li > <a href="about-us.php">            About us</a>
     </li>
    <li > <a href="support.php">            Support</a>
    </li>
     <li id="paskutinis" > <a href="support.php">            Support</a>
     </li>
</ul>
<p id="musetemplatespro" ><a href="index.php">MuseTemplatesPro.com</a></p>
     <a id="cart" href="cart.php">Your Cart</a>
</div>
</body>
</html>
<?php ob_end_flush(); ?>
CSS:
<style>
/** head **/
#menu ul {list-style:none;
position:absolute;
margin-left:0px;
#menu li {
          float: left;
          width: 160px;
          background-color: #444444;
          text-align: center;
          border-right: 2px solid white;
          display: block;
          height: 30px;
          line-height: 30px;
          margin-top: 300px;
          list-style: none;
          margin-left: 0px;
#menu li#paskutinis {
          float: left;
          width: 150px;
          background-color: #444444;
          text-align: center;
          border-right: 3px #444444;
          display: block;
          height: 30px;
          line-height: 30px;
          margin-top: 300px;
          list-style: none;
#header {
          background-image: none;
          position: absolute;
          height: 250px;
          width: 960px;
          left: 100px;
          margin-top: 0px;
#header img{
          position: absolute;
          left: 0px;
          top: 0px;
          width: 960px;
#menu li ul li {
float:none;
width:150px;
text-align:left;
display:block;
border-top:1px solid white;
div#menu ul#menu_   {
float:none;
width:150px;
text-align:left;
padding-left:155px;
border-top:1px solid white;
#menu ul#q   {
position:absolute;
top:0px;
left:0;
visibility:hidden;
#menu li#q:hover ul {
visibility:visible;
#menu li:hover ul {visibility:visible;}
#menu a {
          text-decoration: none;
          color: white;
          font-family: Helvetica, Arial, sans-serif;
          display: block;
#menu li:hover {background-color:maroon;}
#menu {
          position: absolute;
          width: 960px;
          height: 30px;
          margin-top: 0px;
          left: -40px;
          top: -10px;
#head
margin-left:200px;
width:923px;
background-image: url('http://musetemplatespro.com/images/head.jpg');
height: 300px;
#head
margin-left:200px;
width:923px;
background-image: url('http://musetemplatespro.com/images/head.jpg');
height: 300px;
a#cart
          position: absolute;
          margin-left: 1000px;
          margin-top: -55px;
          text-decoration: none;
          color: white;
          font-family: Helvetica, Arial, sans-serif;
          font-size: 25px;
          padding: 5px;
          border: 1px solid white;
          left: -180px;
          top: 296px;
p#musetemplatespro
          margin-top: -1600x;
          margin-left: 65px;
          position: absolute;
          color: white;
          font-family: Helvetica, Arial, sans-serif;
          text-decoration: none;
          left: 25px;
          top: 19px;
p#musetemplatespro a
color:white;
font-family: Helvetica, Arial, sans-serif;
font-size: 35px;
text-decoration:none;
</style>
ul {
          left: 0px;

Design View is just an approximation of how the page will appear minus any scripting. Never rely on it for anything more than a quick reference "click the element to select it" style interface.
Live View is a "mostly there" version of a Webkit browser (Safari or Chrome). It's more accurate, but still doesn't give you everything.
Preview in Browser is your page in an actual browser that is installed on your machine (not an emulation) and should be used to determine how your page will actually appear. The more browsers you preview in, the better. I test in IE10 (9, 8 and 7 in dev tools), Firefox, Chrome, Safari and Opera using PIB.
Make sure to run your pages through the validator at http://validator.w3.org to catch any coding errors. HTML errors are one of the biggest causes of display problems between Design View, Live View and each individual browser and browser version.

Different font sizes in Explorer and Safari

Hi there, before I go completely nuts can someone give me a
hand with figuring out how I can get my plain old body text to
display at the same size in both Explorer and Safari.
I am using a Mac myself, but when entering text at size 1, it
is displaying larger in Explorer (at about the size I want) and
very small in Safari (too small to be easily readable). I have done
some research and thought cascading style sheets might be the way
to go but I have also read that the some text problems occur when
using cascading style sheets.
I haven't bothered with them previously as there hasn't been
that much text to bother with them.
Has anyone got any tips, or has used CSS to fix this problem?
Regards,
Elle V
p.s. if you are using a mac, you can check out what I mean by
viewing www.homestylefinance.com.au/company.html in both browsers.
I would be interested in hearing from a PC user to see if they are
seeing the same thing.

You can define your text sizes in many different ways:
points, pixels, em,
percentages, etc.
I personally use a percentage to define my base font-size in
my style sheet,
and then declare different text sizes in em's for different
selectors. I'd
stay away from points (which it sounds like you're using them
- due to the
fact that cross-browser display varies). I'd also stay away
from pixels,
because IE users can not resize their browser text size.
My personal suggestion would be to use em's to declare your
font sizes. Here
is an example of something you could put in your CSS document
(which you'll
want to start using):
body { font-size: 100%; }
.text1 { font-size: .75em }
HTH, take care.
Shane H
[email protected]
http://www.avenuedesigners.com
=============================================
Proud GAWDS Member
http://www.gawds.org/showmember.php?memberid=1495
Delivering accessible websites to all ...
=============================================
"Elle V" <[email protected]> wrote in
message
news:e89ngu$ga6$[email protected]..
> Hi there, before I go completely nuts can someone give
me a hand with
> figuring
> out how I can get my plain old body text to display at
the same size in
> both
> Explorer and Safari.
>
> I am using a Mac myself, but when entering text at size
1, it is
> displaying
> larger in Explorer (at about the size I want) and very
small in Safari
> (too
> small to be easily readable). I have done some research
and thought
> cascasing
> style sheets might be the way to go but I have also read
that the some
> text
> problems occur when using cascading style sheets.
>
> I haven't bothered with them previously as there hasn't
been that much
> text to
> bother with them.
>
> Has anyone got any tips, or has used CSS to fix this
problem?
>
> Regards,
>
> Elle V
>
>

Are Transient VO & attributes handled differently ?????????????????????????

Hi All,
i'm using jdev10.1.2, adf bc's and jsp's. I'm having a transient attribute problem. I can populate these values fine, but subsequently if i try and manipulate these transient attributes, their values are all null. I've handled these tranient attributes exactly as you would any regular attribute. i just cant understand why they're not behaving as i would expect.
So my question is, are the transient attributes handled differently??? Is there a property i need to set that i'm missing? do they need to be inserted into views in a special?
If anyone could shed any light in the subject i would be most grateful or even if anyone could point me towards a good site on the subject.....
Thanks,
Liz

Liz,
Have a look at section 28.6 of the ADF Developer's Guide for Forms/4GL Developers (version 10.1.3.1.0 - I don't have the equivalent 10.1.2 version handy. It says, in part:
Transient view object attributes are not passivated by default. Due to their nature, they
are usually intended to be "read only" and are very easily recreateable. So, it often
doesn’t make sense to passivate their values as part of the XML snapshot. However,
by checking the Passivate checkbox on the Attribute page of the View Object Editor
for any transient attribute, you can declaratively configure it to be
passivation-enabled.
Hope this helps,
John

Designing for iPad. Horizontal Scroll & Different Page Sizes.

Putting together a pdf for iPad using cs6.
I have content that fits a standard iPad format BUT I also have these very long timelines (170cm x 21 cm). These need to be displayed zoomed in – with the reader swiping right to accessing the remainder of the content (so a horizontal scroll).
Whenever I test it on the iPad it displays the full image (so zoomed out and tiny).
Just to clarify – I have two different page sizes in the same document – standard iPad size and then these annoyingly long ones....
So how do I make sure I view them right on the iPad? I need the zoom/fixed start on the long images.
Sorry a bit of a novice with anything for iPad.
Thanks!

Hi,
Go the page in which u have added the iview.
choose page layout.
Set "1 Column (Full Width)" for the column property
The Default Layout should be 1 Column (Full Width).
Regards,
Krishna Kumar

How to get standard size viewable across different monitor sizes?

How can I get the same view size with media buttons on the bottom ie like full screen across the different size monitors?
im creating a captivate demo.
however the target is
large monitors 21 inch
and different laptop models and screen
size.
I would like the output in as SWF - html.
Ive been playing around with the settings and these are my results:
Setting:Record and Capture area ‘Full Screen’
the result:
looks great on the 21 inch monitor.
the same .html file on the laptop
the result is:
cuts off the recording on the bottom the screen. so you have to use the scroll bars to see the full screen
if I Rescale the Project
from
width percentage:100
Height percentage:100
to:
width percentage:70
Height percentage:70
the result is:
loss of quality on both laptop screen & desktop screen.
If I publish as a Media .exe.
The result is a very large .exe file size compared to a html file
Any ideas?
thank you
dd

The rule of thumb I always use it to capture the original screen recordings at the same resolution as the lowest resolution device I expect to view the demo. So if you are doing your screen capture from a 21inch screen but expect people to play it back on 14 inch laptops, find out what resolution the 14 inch laptops are operating at, temporarily change the resolution of the device connected to the 21 inch screen to match the resolution of the 14 inch laptops - record all your screen captures - then change the resolution back to normal on the 21 inch display only after you have finished recording. You then shouldn't have to mess around with rescaling and it should look great on everything! Work at the lowest common denominator.
(apologies in advance if I misunderstood what you were asking)

11gr1 - Handling different screen resolutions for an enterprise app.

Hi,
We are developing an enterprise application that will be deployed at different clients with different hardware.
We are confused about how to handle different screen resolutions and wonder how others are handling this.
We have some fixed size areas in our screens and liquid areas for content that may expand. The problem is say that you have a table with 6 columns. This table will be rendered nicely at 1280X800 but not at 1650X1050 or 800X600.
At higher resolutions we will either end up having some blank space or expand one of the columns of the table , but can't expand every column proportionally and this will look ugly.
For lower resolutions same problem in a different way will come into picture, we will not able to resize the columns and end up with scroll bars etc ...
What is the best practice with handling different screen resolutions for components like table,panel splitter etc ?
Thanks

Hi Muhammed,
I don't think that any better solution exists, you already use liquid layouts and define widths & heights with percentages etc. In my opinion using blank column at the end of table columns makes table's looking better. Additionally creating custom skin for table and defining column heights & widths with % or em may help you to stretch columns?

Handling different view sizes

Similar Messages

Maybe you are looking for