Develop Reference

Custom Relative layout not rendering any children

Intro:
I am attempting to add various Views to my custom RelativeLayout, i.e. Buttons, ImageViews, etc however none of them render/show.
Documentation:
As shown on numerous SO questions: here, here, here, here and many more,
I have the standard requirements for extending a layout, i.e. the 3 constructors, that being:
public RelativeLayout(Context context) {}
public RelativeLayout(Context context, AttributeSet attrs) {}
public RelativeLayout(Context context, AttributeSet attrs, int defStyleAttr){}
referred to here on Android Developer site.
Implementation:
My RelativeLayout named DiceRoller has the following implementation:
public class DiceRoller extends RelativeLayout {
private DieContainer dieContainer;
private Context mContext;
private int speed;
private Runnable moveDies;
private Handler handler;
private Timer timer;
public DiceRoller(Context context) {
super(context);
mContext = context;
init();
}
public DiceRoller(Context context, AttributeSet attrs) {
super(context, attrs);
mContext = context;
init();
}
public DiceRoller(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
mContext = context;
init();
}
private void init() {
//source : https://stackoverflow.com/questions/28265286/custom-relative-layout-not-showing-child-views
setLayoutParams(new LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
setGravity(Gravity.CENTER);
ImageView mainImage = new ImageView(mContext);
mainImage.setId(1994);
LayoutParams params = new LayoutParams(100, 100);
mainImage.setImageResource(R.drawable.die1);
mainImage.setLayoutParams(params);
addView(mainImage);
RelativeLayout.LayoutParams crossParams = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
crossParams.addRule(RelativeLayout.ALIGN_TOP | RelativeLayout.ALIGN_LEFT, mainImage.getId());
ImageView crossImage = new ImageView(mContext);
crossImage.setImageResource(R.drawable.die6);
crossImage.setLayoutParams(crossParams);
addView(crossImage);
TextView tv = new TextView(mContext);
tv.setText("hello world");
addView(tv);
}
}
Please Note: the contents of the init() method was purely to test if views were infact rendered. This was my last attempt at debugging the issue, previously I added views from my MainActivity aswell, obviously without success
With an associated layout file
<?xml version="1.0" encoding="utf-8"?>
<com.myapp.DiceRoller
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="1000px"
android:layout_height="1000px"
android:background="#color/colorAccent"
android:id="#+id/rollerBack">
</com.myapp.DiceRoller>
What is the problem:
The problem is simple. No child of the layout is rendered/shown/visible.
I attempted adding a child in my MainActivity, programmatically. It did not render. I attempted adding a child within this RelativeLayout class, it did not render.
Additional Info:
note: When adding views, I always added text or some image, I also set the X, Y values, also included RelativeLayout.LayoutParams() with the wrap option set.
When debugging this issue, if I added a view (ImageView, Button, etc), the layout has each child stored, and each child's parent is this RelativeLayout. Each child has a width, height, X, Y value and some content (either an image or text), thus the problem does not lie with the children.
I am at a loss, I have no idea why it doesn't render, any help would be greatly appreciated!

Android: programmatically created image vs resource image

1) Is it possible to create drawable, example
static Bitmap.Config conf = Bitmap.Config.ARGB_8888;
static Bitmap bmp = Bitmap.createBitmap(100, 100, conf);
// something draw
// eventually convert to DrawableBitmap
and then convert it / asiggn as / put in resource, to use in function with resource id param, like:
public void setWidgetLayoutResource (int widgetLayoutResId)
or
2) is it possible to dynamically draw to change image in R.drawable.something.bmp?
All this for change color of widget in setWidgetLayoutResource() to any color, not fixed as color of concrete resource

My own answer
This question is relative to my other: Android PreferenceScreen
and I was do it in this way:
ColorLinesView.java
public class ColorLinesView extends View
{
private static GradientDrawable gdDefault = new GradientDrawable();
public static int fillColor;
public ColorLinesView(Context context, AttributeSet attrs)
{ super(context, attrs);
}
#Override protected void onDraw(Canvas cv)
{
gdDefault.setColor(fillColor);
gdDefault.setCornerRadius(4);
gdDefault.setStroke(2, 0xffbbbbbb);
this.setBackgroundDrawable(gdDefault);
}
}
color_lines_accesory.xml
<?xml version="1.0" encoding="utf-8"?>
<android.swp.ColorLinesView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/colorBoxLines"
android:layout_width="52dp"
android:layout_height="26dp"
android:gravity="right"
android:layout_marginRight="6dp" />
and finally while programmatically create PreferenceScreen, after add category preference "somePref":
ColorLinesView.fillColor = 0xff00ff00; // examply green
somePref.setWidgetLayoutResource(R.layout.color_lines_accesory);
and the same two lines (with new color) in OnPreferenceClickListener() for "somePref" category, after using color picker to change color.
result:

MvxFrameLayout derived class doesn't draw child

I created a test MvxFrameLayout derived class, which I want to draw a child at 0,0 with size 24x24:
public class MyCustomLayout : MvxFrameLayout
{
public MyCustomLayout(Context context, IAttributeSet attrs) : base(context, attrs)
{
}
public MyCustomLayout(Context context, IAttributeSet attrs, IMvxAdapterWithChangedEvent adapter) : base(context, attrs)
{
}
protected override void OnLayout(bool changed, int left, int top, int right, int bottom)
{
if (!changed)
{
return;
}
for (int i = 0; i < this.ChildCount; ++i)
{
var child = this.GetChildAt(i);
child.Layout(0, 0, 24, 24);
}
}
}
Which is used in an activity layout (FirstView.axml) like this:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:local="http://schemas.android.com/apk/res-auto"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<hotspotappandroid.droid.views.MyCustomLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
local:MvxBind="ItemsSource Hotspots"
local:MvxItemTemplate="#layout/hotspot" />
</FrameLayout>
The view model which has one item:
public class FirstViewModel : MvxViewModel
{
public string[] Hotspots { get; private set; }
public FirstViewModel()
{
this.Hotspots = new string[] { "A" };
}
}
The hotspot.xml is an ImageView with an image (circle.png) of 24x24:
<?xml version="1.0" encoding="utf-8"?>
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:local="http://schemas.android.com/apk/res-auto"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:src="#drawable/circle" />
The problem is the circle image is not being drawn.
If in hotspot.xml I change android:layout_width="fill_parent" and android:layout_height="fill_parent to wrap_content, the image is drawn, but not correctly.
The image is drawn in half. It looks like the image is drawn scaled to double of its size and it's cropped by half (probably due to `child.Layout(0, 0, 24, 24)).
I am not sure what is going on. I see that the child in OnLayout is of type cirrious.mvvmcross.binding.droid.views.MvxListItemView instead of 'ImageView' because that I would have expected. Maybe that has something to do?

The MvxFrameLayout works by inflating a child MvxListItemView for each child. The MvxListItemView itself inherits from FrameLayout and has default layout parameters.
According to the docs - http://developer.android.com/reference/android/widget/FrameLayout.html - this means each child FrameLayout should be sized:
The size of the FrameLayout is the size of its largest child (plus padding), visible or not (if the FrameLayout's parent permits)
Since you are specifying fill_parent for the ImageView inner grandchildren here, then I guess that is what is causing your inner views to be zero-sized.
In order to give your child frames some size, it might be better to give them ImageView sizes directly in the inner child XML, instead of requesting fill_parent
If you do want to return an ImageView directly and to use that as the Child - without the intermediate MvxListItemView then in the latest MvvmCross source I believe you can:
inherit a class MyImageView from ImageView and add an IMvxListItemView implementation
use a custom Adapter which creates and returns MyImageView in an overridden CreateBindableView - https://github.com/MvvmCross/MvvmCross/blob/v3/Cirrious/Cirrious.MvvmCross.Binding.Droid/Views/MvxAdapter.cs#L287

How to add view as background to the surfaceView?

Hi I am currently working on Game which contains VIEW of visualization of audio frequency effect in background of surfaceView.
The surfaceView contains actual game play.
I posting some code snippets :-
main.xml
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_margin="5dp"
android:layout_weight="1"
android:background="#000" >
<co.ardor.visualizer.VisualizerView
android:id="#+id/visualizerView"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
</co.ardor.visualizer.VisualizerView>
</FrameLayout>
Visualizer view are created as follows -
public class VisualizerView extends View
{
private static final String TAG = "VisualizerView";
private byte[] mBytes;
private byte[] mFFTBytes;
private Rect mRect = new Rect();
private Visualizer mVisualizer;
private Set<Renderer> mRenderers; // type of Renderer class
private Paint mFlashPaint = new Paint(); // for flash paint
private Paint mFadePaint = new Paint(); // for fade paint
public VisualizerView(Context context, AttributeSet attrs, int defStyle)
{
super(context, attrs);
init();
}
public VisualizerView(Context context, AttributeSet attrs)
{
this(context, attrs, 0);
}
public VisualizerView(Context context)
{
this(context, null, 0);
}
// Some code regarding to the audio visualization..
}
My VisualizerView running well so how I can add this as background to SurfaceView (Actual running Game).I am stuck on the problem that "How to add VIEW as background of surfaceView?" Or any another better solution for that..
Thx in advance..

One possibility you could have a look at is to retrieve the View's drawing cache Bitmap and add the Bitmap to the SurfaceView, drawn behind your game contents.
Retrieve the Bitmap:
myVisualizerView.setDrawingCacheEnabled(true);
mVisualizerBitmap = Bitmap.createBitmap(myVisualizerView.getDrawingCache());
myVisualizerView.setDrawingCacheEnabled(false);
Draw the Bitmap in SurfaceView's onDraw(...):
canvas.drawBitmap(mVisualizerBitmap, //other params);
I'm not sure this is a great idea in terms of performance if you have to retrieve the bitmap every frame of your game but it could be worth exploring.

try to add them using LinearLayout,
and make them on top of each other using:
android:layout_alignLeft="..."
android:layout_alignTop="..."

How can I add a decorator image on top of my image view

I have an ImageView in my android layout. And I would like to add a 'decorator' image at the lower right corner of my image view.
Can you tell me how can I do it?
I am thinking of doing with a FramLayout with 2 image views as its child, but how can i make one image the lower right corner of another?
<FrameLayout>
<ImageView .../>
<ImageView .../>
</FrameLayout>

You probably want to be using a RelativeLayout (Documentation) instead - it supports stacking views, and all you'd have to do is align the bottom and left of the overlay ImageView with the bottom and left.

You could create your own class that extends ImageView. It will always draw decorator over the ImageView content.
public class MyImage extends ImageView {
static Bitmap decorator;
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
if(decorator==null)
decorator = BitmapFactory.decodeResource(getResources(), R.drawable.decorator);
canvas.drawBitmap(decorator, 0, 0, null);
}
public MyImage(Context context) {
super(context);
}
public MyImage(Context context, AttributeSet attrs) {
super(context, attrs, 0);
}
public MyImage(Context context, AttributeSet attrs, int params) {
super(context, attrs, params);
}
}