Jetpack Compose - The preview does not render in real-time - android

I use Compose with AS Arctic Fox v2020.3.1. When I update the code, the preview does not render in real-time. AS show the message "The preview is out of date" and I must click "Build & Refresh". I'd like it to render UI in real-time, similar to XML Design.
How do it?
Thanks in advance.

AFAIK you can't. You're able to edit string values and certain others, such as padding dp's but when adding or removing elements, you have to rebuild to view the updated layout.

Related

Adaptative row in jetpack compose

I have this figma layout to do:
Image here
I already have the chips layout done.
Those chips shows a list of strings.
But I don't know how to get that adaptative row, that when the string are to big, the line break and keep showing in another line.
Can you guys help me please?
Accompanist library has flow layouts that do exactly that: https://github.com/google/accompanist/tree/main/flowlayout
There are also similar flow layouts in the official compose foundation library that were just recently merged, but those are only available as snapshot builds for now.

Get the Xamarin Android Designer to work with the Toolbox

This question is about Xamarin Android which supports drag and drop functionality, not Xamarin Forms.
When using the Xamarin Android Designer in Visual Studio I am only allowed to drag in one control from the toolbox. After this, I am no longer able to add any new buttons (with the cursor changing to a "not allowed" symbol when trying to drag in a new button).
Steps to reproduce the problem:
Create a new Xamarin Android App project in Visual Studio.
Navigate to the "Resources/layout/activity_main.axml".
Try to add two buttons to the Design. Trying to add the second one will show the "not allowed" symbol in place of the cursor.
I've looked online for a solution, including Xamarin Community Forums and the Visual Studio Developer Community and but have only found posts on the same or similar issue with no solution that has worked for me. How can I solve this?
RelativeLayout in Xaml doesn't allow drag&droping more than 1 control by design.
RelativeLayout is a ViewGroup that displays child View elements in relative positions. The position of a View can be specified as relative to sibling elements (such as to the left-of or below a given element) or in positions relative to the RelativeLayout area (such as aligned to the bottom, left of center).
Basically, designer let you add only one control on which you design your interface. You position the other controls from Xaml based on original dragged control.
You can drag&drop controls from toolbox directly to Xml code and it allows you to edit further the control from Properties box.
Also, https://developer.android.com/guide/topics/ui/layout/relative officially recommends to use ConstraintLayout instead.
If you insists to use RelativeLayout, you will have to code the interface in Xaml.

How to remove highlight of the views in preview in Android Studio

After the 3.3 update, I've noticed that most of the views in my XML file has this weird highlight in the preview screen on the right and it very annoying and preventing me of know what my views really look like.
any idea how to remove it?
I guess just tap on the gray background and this removes all selections highlights.

Is it possible to show dummy text for Views in the IDEA Android UI designer?

I've recently switched from eclipse to IntelliJ IDEA for Android development. I'm not missing any features, beside the rather helpful designer preview in eclipse. I populate certain views in my activities at runtime, there are no texts defined in the corresponding XML files. In eclipse, it looks like this:
It fills the empty views with placeholder text which is nice to get a rough impression of the layout without having to start the app. But in IDEA, the designer looks like this:
The views are empty, and it's difficult to even see them without selecting them in the Component Tree. I haven't found anything in the options, is this missing from IDEA or did I miss an option?
It's not possible right now, but it would be nice to have, I've created a new feature request, please vote.

Android layout render without compiling

I'm new to developing with Android, and the biggest new thing is the way the UI is rendered (relative to other views instead of absolute locations and sizes). As a result, I've been experimenting a lot with layouts, and find myself changing 1 view or even just 1 property of a view, then having to recompile and launch it back into the emulator to see the result. Is there a tool that quickly (or at least quicker) shows what a UI looks like give a layout xml file?
You can look at http://www.droiddraw.org/ but it is not perfect.
You can use Eclipse with Android Development Tools, when opening a layout file you get a preview of what looks like. Besides, ADT provides some nice features for developing and debugging in the Android platform.
When you're in the XML view, simply click the "Layout" tab on the bottom, and you'll be taken to a visual representation of your layout:
Like so:
There are some limitations for sure (e.g. text shadowing, for one, will not be depicted in this view), but it's a good way to get a general idea of how your layout is working.
Versions 2.x and higher of Android Studio render the XML in real-time in the Preview pane of the IDE and it even juxtaposes the XML and outline views side by side.

Categories

Resources