Guidelines for using Android and Export Kit?« Back to Questions List
Our design team would like to get some guidelines / help for using this tool efficiently for any of the PSD file they design for Android app development. Can you provide help for the below points – 1. How to manage PSD layer to handle different layout resolution support? Because currently demo creating layout with fix vales of height, width and margins. Is it possible to manage single layout without considering this hardcoded values? 2. How to manage different android graphics resolutions for say below standard resolution support of Android devices – 3. How to manage vector icons / graphics. We found that some graphics becomes rounded corners even though we don’t want that kind of behavior. 4. Also we would like to know which are the Android supported widgets/controls(list view, grid view, spinner, view pager, etc) Export Kit will map while generating auto layouts? Look forward to get your feedback for the designer guidelines to use Expert Kit tool efficiently. |
This question has been resolved, view the correct answer now!
✓ Correct Answer | |
---|---|
IMPORTANT: (a) Android does uses IMPORANT: Android does not allow for project names with ' ' (space) and class names must start with a lowercase letter. Your PSD/AI name is used as your Android project name and your default class name = EXAMPLE: Think DPI, Not Pixel:Consider that Android is 1. You should always design 2. If create a single screen layout and use Android Studio to SCREEN SIZE IS IMPORTANT: 800px in your PSD will target 2560 xhdpi – you must consider pixel to dpi conversion or download our Android PSD templates and start there. Negative (-) Margins Not AllowedDo not “bleed” your background design. Android does not allow for negative (-) margins. In your case, your main background image is larger than the screen – so your content will start where the background starts (note this error in the output res/layouts/ folder with Graphical Preview) Image Sizes/Exports:Export Kit will export your images based on your PSD settings, eg. if you have a higher DPI then it will use that in the image settings. In many situations, you may often design in a lower setting than your target device – this is OK. You can re-export the same PSD after using Image Kit at a higher DPI setting. Text Size:Text size does not always match the Android output size in your layout, this is normal. Photoshop and Android measure items very differently (DPI vs Pixel) so we will add a few adjustments for size correction in future versions. The quick fix is to note the Output size difference, and change your PSD respectively. Horizontal Scroll:This is our default view state. In future versions we plan to support as many Layout types as we can, but for our first release to ensure you “get-what-you-see” we did it this way. Currently your design will export with Relative Layout and Horizontal Scroll, you can remove the scroll view if you like, but if you change the Relative Layout, your element positions may not render correctly. Layout resolutions:This is easy to do, you will need to use our CSS Screen tags to denote which screen size you are targeting. 1. CSS Screen Tag: //exportkit.com/plugin/layer-tags/advanced-layer-tags/css-screen-tag 2. How to create CSS Screens (tutorial, works with Android also): //exportkit.com/plugin/environments/html5/convert-a-psd-to-responsive-html-and-css Screen Size is ImportantYour screen size is important, some of your content will require the user to scroll (if you do not want this, you will need to re-measure your design based on our templates): //exportkit.com/suite/download/127/psd/android. Multiple Device support:This is related to our ${css|screen} tags as they control the layout, but Android is a bit different with its pixel calculations. We have mapped many common screen sizes, and anything else you will have to measure manually. Note that 1. Multiple Device Support (video): //exportkit.com/learn/video-tutorials/advanced-videos/psd-to-android-xml-ui-java-apps 2. Android Multiple Device PSD (From the zip file): [zip folder] \psd_example_files \11_advanced_android \ek127_1102_android_screens.psd Vectors and complex shapes:This is a feature we are supporting soon with better path mapping for SVG, Android, XCode and Swift. We have basic shape support, but if you are using complex vectors – you will have to: a. Convert it to a smart object - OR b. Use an ${img} tag with the layer (converts it to an image): //exportkit.com/plugin/layer-tags/basic-layer-tags/image-tag Lightning Strom will soon have full vector support for many environments. Android Widgets:Widgets are used in almost every Android project – or a subclass of – this makes them a vital part of any Android UI design. Export Kit makes it easy to create your Android widget layout in your design, then render the native Android widget in your project. Take a look at some of the current features. |
Share Your Knowledge!
Contribute to the community and help other users to benefit from your answer with experience and knowledge.