Custom ViewGroup with Layout File [duplicate] - android

I want to implement custom ViewGroup in my case derived from FrameLayout but I want all child views added from xml to be added not directly into this view but in FrameLayout contained in this custom ViewGroup.
Let me show example to make it clear.
<?xml version="1.0" encoding="utf-8"?>
<merge xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<FrameLayout
android:id="#+id/frame_layout_child_container"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<FrameLayout
android:id="#+id/frame_layout_top"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</merge>
And I want to redirect adding all child view to FrameLayout with id frame_layout_child_container.
So of course I overrode methods addView() like this
#Override
public void addView(View child) {
this.mFrameLayoutChildViewsContainer.addView(child);
}
But for sure this doesn't work because for this time mFrameLayoutChildViewsContainer is not added to the root custom view.
My idea is always keep some view on on the top in this container frame_layout_top and all child views added into custom component should go to frame_layout_child_container
Example of using custom view
<CustomFrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!"/>
</CustomFrameLayout>
So in this case TextView should be added to the frame_layout_child_container
Is it possible to delegate adding all views into child ViewGroup like I described.
I have other ideas like using bringToFront() method every time view is added to keep them in correct z-axis order or for example when view is added, save it to array and than after inflating custom view add all views to this child FrameLayout
Suggest what to do in this case in order not to hit performance with reinflating all layout every time new view is added, if it is possible to implement in other way.

Views inflated from a layout - like your example TextView - are not added to their parent ViewGroup with addView(View child), which is why overriding just that method didn't work for you. You want to override addView(View child, int index, ViewGroup.LayoutParams params), which all of the other addView() overloads end up calling.
In that method, check if the child being added is one of your two special FrameLayouts. If it is, let the super class handle the add. Otherwise, add the child to your container FrameLayout.
public class CustomFrameLayout extends FrameLayout {
private final FrameLayout topLayout;
private final FrameLayout containerLayout;
...
public CustomFrameLayout(Context context, AttributeSet attrs) {
super(context, attrs);
LayoutInflater.from(context).inflate(R.layout.custom, this, true);
topLayout = (FrameLayout) findViewById(R.id.frame_layout_top);
containerLayout = (FrameLayout) findViewById(R.id.frame_layout_child_container);
}
#Override
public void addView(View child, int index, ViewGroup.LayoutParams params) {
final int id = child.getId();
if (id == R.id.frame_layout_top || id == R.id.frame_layout_child_container) {
super.addView(child, index, params);
}
else {
containerLayout.addView(child, index, params);
}
}
}

Related

How to load views in XML into a child ViewGroup of the parent ViewGroup [duplicate]

I want to implement custom ViewGroup in my case derived from FrameLayout but I want all child views added from xml to be added not directly into this view but in FrameLayout contained in this custom ViewGroup.
Let me show example to make it clear.
<?xml version="1.0" encoding="utf-8"?>
<merge xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<FrameLayout
android:id="#+id/frame_layout_child_container"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<FrameLayout
android:id="#+id/frame_layout_top"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</merge>
And I want to redirect adding all child view to FrameLayout with id frame_layout_child_container.
So of course I overrode methods addView() like this
#Override
public void addView(View child) {
this.mFrameLayoutChildViewsContainer.addView(child);
}
But for sure this doesn't work because for this time mFrameLayoutChildViewsContainer is not added to the root custom view.
My idea is always keep some view on on the top in this container frame_layout_top and all child views added into custom component should go to frame_layout_child_container
Example of using custom view
<CustomFrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!"/>
</CustomFrameLayout>
So in this case TextView should be added to the frame_layout_child_container
Is it possible to delegate adding all views into child ViewGroup like I described.
I have other ideas like using bringToFront() method every time view is added to keep them in correct z-axis order or for example when view is added, save it to array and than after inflating custom view add all views to this child FrameLayout
Suggest what to do in this case in order not to hit performance with reinflating all layout every time new view is added, if it is possible to implement in other way.
Views inflated from a layout - like your example TextView - are not added to their parent ViewGroup with addView(View child), which is why overriding just that method didn't work for you. You want to override addView(View child, int index, ViewGroup.LayoutParams params), which all of the other addView() overloads end up calling.
In that method, check if the child being added is one of your two special FrameLayouts. If it is, let the super class handle the add. Otherwise, add the child to your container FrameLayout.
public class CustomFrameLayout extends FrameLayout {
private final FrameLayout topLayout;
private final FrameLayout containerLayout;
...
public CustomFrameLayout(Context context, AttributeSet attrs) {
super(context, attrs);
LayoutInflater.from(context).inflate(R.layout.custom, this, true);
topLayout = (FrameLayout) findViewById(R.id.frame_layout_top);
containerLayout = (FrameLayout) findViewById(R.id.frame_layout_child_container);
}
#Override
public void addView(View child, int index, ViewGroup.LayoutParams params) {
final int id = child.getId();
if (id == R.id.frame_layout_top || id == R.id.frame_layout_child_container) {
super.addView(child, index, params);
}
else {
containerLayout.addView(child, index, params);
}
}
}

Replacing View in LinearLayout

I want to replace a View in a LinearLayout programmatically. I tried the following method:
public void drawView() {
//remove previous view, if exists
if(((LinearLayout) findViewById(R.id.chartView)).getChildCount() > 0) {
((LinearLayout) findViewById(R.id.chartView)).removeAllViewsInLayout();
}
//generate new view
CustomView view = new CustomView(this,parameters);
//add new view to layout
((LinearLayout) findViewById(R.id.linLayout)).addView(view);
}
The LinearLayout that this method refers to is defined in XML:
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/linLayout">
</LinearLayout>
The view is drawn correctly the first time (when there is no view yet in the LinearLayout. But the second time drawView is called, the previous View gets removed, but no new view added. How can I replace this programmatically generated view programmatically?
you are removing from this layout ((LinearLayout) findViewById(R.id.chartView)).removeAllViewsInLayout();
but adding to this: ((LinearLayout) findViewById(R.id.linLayout)).addView(view);
replace R.id.linLayout with R.id.chartView

Weird behavior of TextView.setGravity() in custom ViewGroup

I have a project where I need to programmatically create a TextView and place it inside a custom ViewGroup. When I instantiate the textView, I set its layoutParams, text, gravity etc, then add it to the ViewGroup. Then in the onLayout() method of the ViewGroup i try to position it (as recommended by google guidelines).
Everything is fine EXCEPT for the textView's text gravity. Only center_horizontal seems to work. The entire problem can be boiled down to a few lines of code as below:
public class Custom extends ViewGroup {
TextView mTv;
public Custom(Context context, AttributeSet attrs) {
super(context, attrs);
mTv = new TextView(context);
mTv.setText("can't touch this");
mTv.setGravity(Gravity.CENTER);
ViewGroup.LayoutParams params=new ViewGroup.LayoutParams(LayoutParams.MATCH_PARENT,LayoutParams.MATCH_PARENT);
mTv.setBackgroundColor(context.getResources().getColor(R.color.paleblue));
this.addView(mTv,params);
}
public Custom(Context context) {
this(context,null);
}
#Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
mTv.layout(l,t,r,b);
}}
And the XML code:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:custom="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<com.apps.renegade.testbook.Custom
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
</RelativeLayout>
The text should be in the center of the screen. Can anyone explain why is this happening? Thanks
If you want to override a ViewGroup, check this, this is the official document which shows you how to extend a ViewGroup.

Custom view: how to set the root layout

I am trying to create a custom view (which extends RelativeLayout), which wraps a lot of other views.
I would like to create that child-views in a xml layout file. Now I wonder how I could inflate that layout and use it in my custom view. Something like this would be great (inside my custom view):
RelativeLayout rootLayout = (RelativeLayout) inflater.inflate(my xml file)
this.setContenView(rootLayout);
Unfortunatelly this is only possible in activities. Is there something similar for views?
EDIT:
I don't want to use View.addView(rootLayout) cause that adds another view hierachy, which is not needed.
You could try to use the <merge> tag as the root element in your layout and inflate it in your custom RelativeLayout with this as the parent and attachToRoot set to true. You do not have to call addView then.
Here is a similar example with a LinearLayout (bottom of page), should work with RelativeLayout too.
Use the below
View v =getLayoutInflater().inflate(R.layout.mylayout,null);
// inflate mylayout.xml with other views
CustomRelativeLayout cs = new CustomRelativeLayout(this);
// CustomRelativeLayout is a class that extends RelativeLayout
cs.addView(v); // add the view to relative layout
setContentView(cs); // set the custom relative layout to activity
Example :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="111dp"
android:text="TextView" />
</RelativeLayout>
SView
public class SView extends RelativeLayout {
Paint p,paint;
public SView(Context context) {
super(context);
TextView tv = new TextView(context);
tv.setText("hello");
this.addView(tv);
}
}
In MainActivtiy
View v =getLayoutInflater().inflate(R.layout.mylayout,null);
SView cs = new SView(this);
cs.addView(v);
setContentView(cs);
Snap
Edit:
If you wish to inflate in CustomRelative layout
In the constructor
LayoutInflater inflater = LayoutInflater.from(context);
View v =inflater.inflate(R.layout.mylayout,null);
TextView tv = new TextView(context);
tv.setText("hello");
this.addView(tv);
this.addView(v);
Within your view you can get layout inflater from the context, inflate children and add them to this (sub-class of RelativeLayout)
final LayoutInflater inflater = (LayoutInflater) this.getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
final View child = inflater.inflate(R.layout.custom_layout, this, false);
// Then add child to this (subclass of RelativeLayout)
this.addView(child);
Edit:
The code above shows how to inflate children inside a custom view.
This link shows how to insert the custom view itself into XML layout.

Alternatives to creating a Compound Control by extending a Layout

I want to create a custom Compound Control in Android that holds some logic. For the purpose of this example, let's say I want it to switch between two views when clicked.
According to the API guide, it looks like the way to do that is to create a new class that extends Layout, and do everything in there.
So I did just that:
I created a XML layout to inflate for my custom component:
.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/view1"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="Hello"/>
<TextView
android:id="#+id/view2"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="World"
android:visibility="gone"/>
</RelativeLayout>
Then I created my custom Layout class, and added the logic in there:
public class MyWidget extends RelativeLayout {
public final View mView1;
public final View mView2;
public MyWidget(Context context, AttributeSet attrs) {
super(context, attrs);
LayoutInflater inflater = (LayoutInflater)context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
RelativeLayout view = (RelativeLayout) inflater.inflate(R.layout.my_widget, this, true);
mView1 = view.findViewById(R.id.view1);
mView2 = view.findViewById(R.id.view2);
view.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
switchViews();
}
});
}
public void switchViews() {
if (mView1.getVisibility() == View.VISIBLE) {
mView1.setVisibility(View.GONE);
} else {
mView1.setVisibility(View.VISIBLE);
}
if (mView2.getVisibility() == View.VISIBLE) {
mView2.setVisibility(View.GONE);
} else {
mView2.setVisibility(View.VISIBLE);
}
}
}
And finally, I included my custom view in some layout:
.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<com.example.MyWidget
android:layout_height="match_parent"
android:layout_width="match_parent"/>
</RelativeLayout
And that works.
I am not completely happy with that solution though, for 2 reasons:
In the constructor of MyWidget, I instantiate 2 nested RelativeLayout by calling the super() constructor, and the one that is at the root of my XML layout. For that, I know I can instead use <merge> as my XML root and that gets me rid of the extra RelativeLayout. Except that defining XML attributes, such as android:background on my <merge> tag doesn't have any effect, so I have to define it programmatically, which is not as nice.
The custom View is a subclass of RelativeLayout, and therefore expose methods it inherits from it, such as addView(), even if it doesn't make sense to add child views to it. I know I can override those methods to prevent users from doing that, but I would still find it cleaner to inherit from View.

Categories

Resources