Android Custom Views in Eclipse Visual Editor

Question

In my applications, I often rely on custom assembly views, for example, in the following example.

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:background="@color/light_grey" android:layout_height="match_parent" android:layout_width="fill_parent" > <TextView style="@style/CardTitle" android:id="@+id/card_title" android:layout_height="wrap_content" android:layout_width="fill_parent" /> <com.whiterabbit.cards.ui.AspectRatioImageView android:id="@+id/card_picture" android:layout_width="fill_parent" android:layout_height="wrap_content" android:adjustViewBounds="true" android:layout_marginLeft="30dip" android:layout_marginRight="30dip" android:src="@drawable/boss" /> <ListView android:id="@+id/card_properties" android:layout_width="fill_parent" android:layout_height="wrap_content" /> 

The problem is that I don’t know how it will be displayed correctly until I run it on a real device or on an emulator. Moreover, if I found something wrong, I would have to make changes on it and deploy the application again to see if the changes worked as you expected.

It can be a long and boring process, especially if the application requires some interaction to get the activity you want to test.

Using the visual editor does not work, because it cannot load a custom view.

Is there any other way to check how views are displayed without running through the entire application?

Answer 1

You can do this in your custom view:

 if(!isInEditMode()){ // Your custom code that is not letting the Visual Editor draw properly // ie thread spawning or other things in the constructor } 

http://developer.android.com/reference/android/view/View.html#isInEditMode ()

This allows you to hide the code from the ADT XML plugin viewer and hopefully displays your layout!

View.isInEditMode ()

Indicates whether this view is currently in edit mode. A look is usually in edit mode when displayed in a developer tool. For an instance, if this view is drawn by the visual user interface of the builder, this method should return true. Subclasses should check the return value of this method to provide different behavior if their normal behavior can interfere with the host environment. For instance: the class spawns a stream in its constructor, the drawing code depends on the features of the device, etc. This method is usually tested in the drawing code of custom widgets.

Answer 2

You can create a skeleton operation that only loads the view that you want to view and fill it with enough data to display it.

Answer 3

I use Android Studio, so I'm not sure if this answer will be applied to your case.

I think you can override the onDraw method in a custom view, for example, to preserve the proportions of the inner image:

 @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); // TODO: consider storing these as member variables to reduce // allocations per draw cycle. int paddingLeft = getPaddingLeft(); int paddingTop = getPaddingTop(); int paddingRight = getPaddingRight(); int paddingBottom = getPaddingBottom(); int w = getWidth() - paddingLeft - paddingRight; int h = getHeight() - paddingTop - paddingBottom; w = w<h ? w : h; h = w; // Draw the example drawable on top of the text. if (dieDrawable != null) { dieDrawable.setBounds(paddingLeft, paddingTop, paddingLeft + w, paddingTop + h); dieDrawable.draw(canvas); } } 

This method works both in the emulator and in the designer.

It also works for any event that redraws the view (onSizeChanged, onLayout, etc.)