My question its very simple, how can I switch between layouts using buttons in each layouts?
Layout1:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="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">
<Button
android:id="#+id/button"
android:layout_width="54dp"
android:layout_height="54dp"
android:layout_marginTop="7dp"
android:layout_marginEnd="7dp"
android:layout_marginRight="7dp"
app:backgroundTint="#FFFFFF"
app:icon="#drawable/ic_polygon"
app:iconTint="#000000"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
Layout2:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="7dp"
android:layout_marginLeft="7dp"
android:layout_marginTop="7dp"
android:text="Back"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
The buttons:
btn_1= findViewById(R.id.button);
btn_2= findViewById(R.id.button1);
btn_1.setOnClickListener(new View.OnClickListener(){
#Override
public void onClick(View v) {
setContentView(R.layout.layout2);
}
});
btn_2.setOnClickListener(new View.OnClickListener(){
#Override
public void onClick(View v) {
setContentView(R.layout.layout1);
}
});
The first button works fine, but the seconds doesnt.
I have tried inflate the view as well:
view_2 = getLayoutInflater().inflate(R.layout.layout2, null);
btn_2 = view_2.findById(R.id.button2);
I need to add more details, so, here I am.
I am want to switch layout using buttons, indeed the first button change the layout, but when I already change the layout I cannot use the other button to "return" to the first layout. Its suppose to look like a menu.
after many tests, it is best to use another application or fragments, where you can create another layout and change it without problems.
Related
I am a new android developer. How can I insert a button in another button. I have a button Department in it I want to insert other buttons IT, accounts, sales and Transport. That is when button department is clicked by the user it will allow the user to view and select the department. Please assist
You should create a Linear layout in the xml file and place and position your accounts,IT, other departments button into linear layout/Relative layout but initially set that parent linear/Relative layout visibility to invisible like -
Add the below property
android:visibility="invisible"
and on the click listener of your button ,set its visibility to true dynamically like below -
linearlayout.setVisibility(View.VISIBLE);
You don't need to insert a button to another .. What you need is clickable layout including textViews as labels.
Here is an example:
your layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:id="#+id/content_main"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/department_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?android:attr/selectableItemBackground"
android:clickable="true"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:background="#FFaa"
android:gravity="center"
android:padding="16dp"
android:text="IT"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:background="#FFffffaa"
android:gravity="center"
android:padding="16dp"
android:text="Account"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:background="#FFffaaff"
android:gravity="center"
android:padding="16dp"
android:text="sales"
/>
</LinearLayout>
</RelativeLayout>
And in your activity:
LinearLayout linearLayout=(LinearLayout)findViewById(R.id.department_layout);
linearLayout.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
//your stuff here
}
});
Result:
If you want to reach these widgets (TextView), then use:
TextView tvIt=(TextView)linearLayout.getChildAt(0);
TextView tvAccount=(TextView)linearLayout.getChildAt(1);
TextView tvSAle=(TextView)linearLayout.getChildAt(2);
Alternatively you could add simple set of buttons and they all share same listener.
So I have an xml that consists of a linear layout containing a Button and a TextView like this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="100dp"
android:orientation="vertical">
<Button
android:id="#+id/btnCell"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="start"
android:paddingLeft="40dp"
android:text="Button"
android:textColor="#color/blueText" />
<View
android:height="wrap_content"
android:width="wrap_content"
android:background="#drawable/Test"/>
</LinearLayout>
And I want to use this same layout inside other layouts in a different xml. I need the same button at every time, so I reuse it by including it in the two layouts (both layouts are in the same xml, but ones is hidden):
First one
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/image"
/>
<include layout="#layout/buttonLayout"/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
Second One:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:visibility="gone"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/image"
/>
<include layout="#layout/buttonLayout"/>
<CheckBox
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
So I show the first layout and hide the second one at the beginning of the app , as the user moves within the interface, the layouts exchange so that the other one is shown and the first one hidden.
The thing is that I declare the Button in my java activity class like this:
btnCell = (Button) thirdView.findViewById(R.id.btnCell);
btnCell.setOnClickListener(this);
And implemented the listener.
#Override
public void onClick(View v) {
if (v == btnCell) {
System.out.println("entered if");
}
System.out.println("entered function");
}
The problem is that when I click the button when the first view is shown and the second hidden, the button works just fine, but when I unhide the second layout, hide the first one, and proceed to click the button, that should be the same as the first one but in a different layout, nothing happens. I searched and find out, that this happens because the id is assigned only to the button shown in the first layout because of view hierarchy, but not the one in the second layout. How can I make both buttons react to the same action, without declaring a new button in each layout but instead reusing it?
I have used this type of layout. you can create Id different for both and inflate that view and give different name so You can differentiate both thing.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/image"
/>
<include android:id="+id/firstOne" layout="#layout/buttonLayout"/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
android second one is
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:visibility="gone"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/image"
/>
<include android:id="+id/secondTwo" layout="#layout/buttonLayout"/>
<CheckBox
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
The Problem is both the layout are include in same layout file and the id of that
button are same so whenever you click on any of the button at the same time event will fire on both button like both are clicked.
So, you have to give the different id for both the button I hope it works fine..
You can add a different Id for each included layout:
<include android:id="+id/layout_a" layout="#layout/buttonLayout"/>
and
<include android:id="+id/layout_b" layout="#layout/buttonLayout"/>
and then use two findViewById to reach them:
btnCellA = (Button)thirdView.findViewById(R.id.layout_a).findViewById(R.id.btnCell);
btnCellB = (Button)thirdView.findViewById(R.id.layout_b).findViewById(R.id.btnCell);
Trying to change a layout from an ImageButton but when i run it on my phone it does not switch instead it says program has stopped.
Java;
public class MainActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ImageButton ImageButton = (ImageButton) findViewById(R.id.image);
ImageButton.setBackgroundColor(1);
ImageButton.setOnClickListener(new View.OnClickListener(){
#Override
public void onClick(View view)
{
setContentView(R.id.aaa);
}
});
}
}
XML for first layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.bassammetwally.anew.MainActivity">
<RelativeLayout
android:layout_width="420dp"
android:layout_height="50dp"
android:background="#3955a1">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Writer's Block"
android:textColor="#ffffff"
android:textSize="30dp"
android:layout_marginLeft="10dp"
android:layout_marginTop="4dp"
android:id="#+id/Asd"/>
<ImageButton
android:layout_width="20dp"
android:layout_height="40dp"
android:src="#drawable/pen"
android:layout_marginLeft="380dp"
android:layout_marginTop="5dp"
android:scaleType="fitXY"
android:adjustViewBounds="true"
android:id="#+id/image"/>
</RelativeLayout>
</LinearLayout>
Second layout to change to;
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/aaa">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Ans"/>
</LinearLayout>
I think it might have something to do with my syntax.
You need to use a layout reference instead of an id
setContentView(R.layout.view);
Where view.xml is the layout you want.
You may want to rethink your approach, though. Using Fragments is preferred over completely replacing the layout because your ImageButton is no longer usable and you'll need to recall findViewById for any new views that are displayed.
If you just want to load a layout file and add it to the current layout, see Inflating one layout
I'd like to achieve such a layout, where user got 2 control panels. He is able to switch from first to second by pressing button and vice versa.
Already have tried to use LayoutInflater, however, without success :/
The main reason, why doing it with 2 different layouts is, that buttons will be almost on the same position, so i'd like to prevent all that mess in one layout and create 2 separate control panel layouts.
Here are my layouts:
main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layout_root"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/control_panel_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="5">
<!-- Here comes including layouts-->
</RelativeLayout>
</LinearLayout>
control_panel_1.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/control_panel1"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="#+id/btn_action1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_action_selector"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true" />
<Button
android:id="#+id/btn_action2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_action_selector2"
android:layout_centerVertical="true"
android:layout_toLeftOf="#+id/btn_action1"
android:layout_marginRight="50dp"/>
<Button
android:id="#+id/btn_action3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_action_selector3"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/btn_action1"
android:layout_marginLeft="50dp" />
</RelativeLayout>
control_panel_2.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/control_panel1"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="#+id/btn_action3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_action_selector4"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true" />
<Button
android:id="#+id/btn_action4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_action_selector5"
android:layout_centerVertical="true"
android:layout_toLeftOf="#+id/btn_action3"
android:layout_marginTop="20dp"
android:layout_marginRight="60dp"/>
</RelativeLayout>
MainActivity.java
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.layout_root);
RelativeLayout controlPanelLayout = (RelativeLayout) findViewById(R.id.control_panel_layout);
//Inflate first control panel on activity start
LayoutInflater layoutInflater = (LayoutInflater)
this.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View controlPanel1 = layoutInflater.inflate(R.layout.control_panel_1.xml);
controlPanelLayout.addView(controlPanel1)
}
EDIT:
As shown in the image, let's say activity starts with Screen1 and once user press Btn1, Screen2 appears...as you can see, only control panel has been switched.
however, it won't inflate that layout at start of application...
Thanks in advance for any suggestions, hints...
Inflate your control panel in onCreateView() and when handling button click (to change panel). The code should be somewhat like this:
private void inflateYourPanel(int panelLayoutID, ViewGroup placeholder) {
placeholder.removeAllViews();
View view = LayoutInflater.from(mActivity).inflate(panelLayoutID, placeholder, false);
//find your views and set values and listeners
placeholder.addView(view);
}
Edit: placeholder may be any layout (control_panel_layout) inflated when starting activity etc
Still may be you'd better look at Fragments - it may fit your purpose better and provide more scalability
There are 3 xml files. Main.xml has a linear layout.
Button.xml just contains a button.
txt.xml just contains an edit text.
I inflate button.xml to Main.xml.
Looks fine.
Button has the same size as it was in Button.xml.
Next i inflate edit text to Main.xml which has an ems=10(android:ems="10").
When i run, the button changes its size to same as that of edit text.
How does that happen and how to overcome the problem. the code is pasted.
Main.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/hello_world"
tools:context=".First" />
<LinearLayout
android:id="#+id/ll"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
</LinearLayout>
</LinearLayout>
Button.xml
<?xml version="1.0" encoding="utf-8"?>
<Button xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button"
/>
txt.xml
<?xml version="1.0" encoding="utf-8"?>
<EditText xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/editText1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ems="10"
>
<requestFocus />
</EditText>
Main.java
public class First extends Activity {
LinearLayout lout;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_first);
final LayoutInflater inf=(LayoutInflater)getSystemService(Context.LAYOUT_INFLATER_SERVICE);
Button btn=(Button)inf.inflate(R.layout.button, null);
lout=(LinearLayout)findViewById(R.id.ll);
lout.addView(btn);
btn.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
// TODO Auto-generated method stub
if(lout.getChildAt(5)==null){
EditText e=(EditText)inf.inflate(R.layout.txt, null);
lout.addView(e);
}
}
});
}
on 5 clicks of the button, 5 edit texts will show up. but the moment i click the button the size of the button changes in addition to the edit text formation.
Please paste your code here, only then anybody can help you. Still you can set a layout_height & layout_width of the button to something like 20sp(as per your need).
In your Main.xml file you need to fix the width of the layout as the layout is small at first because the textview is small. But when you click on the Button the layout increases as per the required width for the EditText and so the Button size also increases:
<LinearLayout android:id="#+id/ll"
android:orientation="vertical"
android:layout_width="100sp"
android:layout_height="wrap_content" >
</LinearLayout>