Android: UI elements over canvas layer - android

How do I set some UI elements over (on top of) canvas?
I have a simple touch game that has its graphics placed on custom view with canvas. However as my full screen Panel is in the setContentView() I can't add any UI items like progressBar or logo. I would like to have whole canvas layer visible with some objects (progressBar, logo) "floating" over it.
Main class:
public class GameClass extends Activity implements OnGestureListener {
Panel panel;
public void onCreate(Bundle savedInstance) {
super.onCreate(savedInstance);
panel = new Panel(this, 1, 2);
setContentView(Panel);
...
}
Panel class:
public class Panel extends View {
public Panel(Context context, int Var1, int Var2) {
super(context);
...
}
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
...
}
}
As code shows, touches are handled inside GameClass and the changes in animation are handled inside Panel.
Or maybe.. Would it be possible to start new transparent activity with progress bar and button so that both the button on overlay activity AND objects on underlying activity? And I could need a way to close all the layers (transparent activity, Panel, GameClass) with the button on transparent activity. Complicated? :D

I do have the same problem and here is how I solved it
#Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.game);
drawView = new DrawView(this);
drawView.requestFocus();
LinearLayout upper = (LinearLayout) findViewById(R.id.LinearLayout01);
upper.addView(drawView);
ImageButton menu = (ImageButton) findViewById(R.id.ImageButton01);
menu.setOnClickListener(new OnClickListener()
{
#Override
public void onClick(View v)
{
finish();
}
});
ImageButton reset = (ImageButton) findViewById(R.id.ImageButton02);
reset.setOnClickListener(new OnClickListener()
{
#Override
public void onClick(View v)
{
drawView.resetGame();
}
});
}
instead of setting contentview to panel adding it Linearlayout that is added in my game.xml and here goes my
game.xml
<?xml version="1.0" encoding="utf-8"?><RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:background="#drawable/game_background">
<LinearLayout
android:id="#+id/LinearLayout01"
android:layout_width="fill_parent"
android:layout_height="350dip" />
<LinearLayout
android:id="#+id/LinearLayout02"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/LinearLayout01">
<ImageButton
android:id="#+id/ImageButton01"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/menu"></ImageButton>
<ImageButton
android:id="#+id/ImageButton02"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/reset"></ImageButton>
</LinearLayout>
<LinearLayout
android:layout_below="#+id/LinearLayout01"
android:orientation="vertical"
android:layout_width="fill_parent"
android:id="#+id/layout_ad"
android:layout_height="wrap_content" />

Related

setContentView and buttons in Android

I have an Activity which has a button and by code I draw a Circle, so my Circle class is:
public class Circle extends View {
private float x = 100;
private float y = 100;
private float radius = 50;
public Circle(Context context) {
super(context);
}
protected void onDraw(Canvas canvas){
Paint paint = new Paint();
canvas.drawCircle(x, y, radius, paint);
}
}
And the code of my activity is:
public class AnotherTest extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
Circle c = new Circle(this);
setContentView(c);
}
}
But when I invoke setContentView, the button seems to be deleted. Any tips to show the circle and preserve the button?
The button you mentioned is in your activity's layout XML file? If so, could you provide the code? setContentView() will only show the circle. If you want to add the circle to your existing layout you have to add it to a ViewGroup in your Activity's XML.
You could do something like this:
public class AnotherTest extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.anothertest_activity);
}
}
And the (res/layout/)anothertest_activity.xml file could look like this:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout android:id="#+id/content"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="#+id/myButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<your.package.Circle
android:id="#+id/myCircle"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
In Android Studio, right below the xml code are two tabs: "Design" and "Text". Switch to "Text" to paste code, switch back to "Design" to position your elements.
If you drag your views, you have an layout XML file. In the Activity you need to set this file as your content view, otherwise you wouldn't see your views. But you can add views dynamically by doing something like this:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout android:id="#+id/content"
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/my_viewgroup"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="#+id/myButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</RelativeLayout>
And in your Activity:
public class AnotherTest extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// Still your xml with your button but without circle
setContentView(R.layout.anothertest_activity);
// First find your ViewGroup to add Views to
RelativeLayout viewGroup = (RelativeLayout) findViewById(R.id.my_viewgroup);
// Add a new circle to existing layout
viewGroup.addView(new Circle());
}
}
You also could add everything dynamically:
public class AnotherTest extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
ViewGroup viewGroup = new LinearLayout(this);
setContentView(viewGroup);
viewGroup.addView(new Button());
viewGroup.addView(new Circle());
}
}
But I strongly recommend using xml layouts. Might want to take a look at Android Layouts

Unable to call methods with a button in PreferenceActivity

This is my first time to use PreferenceActivity.
I have made a simple activity for a settings screen, and when I set up a button in the layout and set the onClickListener for the button, there are no actions nor are there any errors.
All I want to do is to send the user back to the main screen by pressing the button. Is there some error or some setup that I have missed?
The mysterious part is that neither the xml onClick nor the direct method call work. No actions, no errors, it does not even show a Toast (when altered for debugging). Is there anyone who actually used PreferenceActivity and used some widgets like buttons ?
Here is my sample activity for the Settings Screen
public class Settings extends PreferenceActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_settings);
//This button doesn't work
Button b = (Button)findViewById(R.id.setupid);
b.setOnClickListener(new View.OnClickListener(){
#Override
public void onClick(View v) {
Intent i = new Intent(Settings.this,HomeActivity.class);
startActivity(i);
}
});
getFragmentManager().beginTransaction().replace(android.R.id.content, new MyPreferenceFragment()).commit();
}
public static class MyPreferenceFragment extends PreferenceFragment
{
#Override
public void onCreate(final Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
addPreferencesFromResource(R.xml.preferences);
}
}
}
Here is the xml layout for the Settings.java
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
>
<ListView android:id="#android:id/list"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="5" />
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#3498db"
android:gravity="center"
>
<Button
android:layout_width="wrap_content"
android:layout_height="50dp"
android:text="Set"
android:id="#+id/setupid" />
</LinearLayout>
</LinearLayout>
You didn't have to use the Fragment in the first place. All you have to do is to use addPreferencesFromResource(R.xml.preferences); under setContents View.
public class Settings extends PreferenceActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_settings);
//It is depricated but it works
addPreferencesFromResource(R.xml.preferences);
Button b = (Button)findViewById(R.id.setupid);
b.setOnClickListener(new View.OnClickListener(){
#Override
public void onClick(View v) {
Intent i = new Intent(Settings.this,HomeActivity.class);
startActivity(i);
}
});
//getFragmentManager().beginTransaction().replace(android.R.id.content, //new MyPreferenceFragment()).commit();
}
}

Create a panel that slides up and out of the screen in Android

i need some guidance. I need to make a custom view that touched and drag up the screen slides out of the screen. I have tried this cool library: here but this is dependend to exactly 2 layouts. The one that is slided out and the one that remains after that. What i have now is buggy and ugly.
public class DemoActivity extends Activity {
private SlidingUpPanelLayout mLayout;
private RelativeLayout layout;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_demo);
layout = (RelativeLayout) findViewById(R.id.panel);
final int defaulttop = layout.getTop();
final int defaultbottom = layout.getBottom();
RelativeLayout dragView = (RelativeLayout) findViewById(R.id.dragView);
mLayout = (SlidingUpPanelLayout) findViewById(R.id.sliding_layout);
mLayout.setDragView(dragView);
mLayout.setPanelSlideListener(new PanelSlideListener() {
#Override
public void onPanelSlide(View panel, float slideOffset) {
}
#Override
public void onPanelExpanded(View panel) {
System.out.println("panel expanded");
}
#Override
public void onPanelCollapsed(View panel) {
System.out.println("panel collapsed");
}
#Override
public void onPanelAnchored(View panel) {
System.out.println("anchored");
}
#Override
public void onPanelHidden(View panel) {
System.out.println("panel is hidden now");
}
});
}
#Override
public void onBackPressed() {
if (mLayout != null && mLayout.isPanelExpanded()) {
mLayout.collapsePanel();
} else {
super.onBackPressed();
}
}
}
The layout:
<RelativeLayout 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=".DemoActivity" >
<com.sothree.slidinguppanel.SlidingUpPanelLayout
xmlns:sothree="http://schemas.android.com/apk/res-auto"
android:id="#+id/sliding_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/transparent"
android:gravity="bottom"
sothree:dragView="#+id/dragView"
sothree:panelHeight="60dp"
sothree:paralaxOffset="60dp"
sothree:shadowHeight="0dp" >
<RelativeLayout
android:id="#+id/panel"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/unt"
android:orientation="vertical" >
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:layout_gravity="center"
android:text="Sleep" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/dragView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/transparent"
android:clickable="true"
android:focusable="false" >
</RelativeLayout>
</com.sothree.slidinguppanel.SlidingUpPanelLayout>
</RelativeLayout>
it slides up but leaves a white background in the back. If i touch the screen then it slides. So, i need a new path. Did anyone confrunted with something similar? I need a hint, not code. Thanks.
I have used the library you mentioned here and it worked out fine for me. You might have not set the drag view/layout
Do use mSlidingPanelLayout.setDragView(YourLayout) to set the layout that can be dragged
I have done something like this previously but with a button.
I did it using Animation class when moving it by OnTouchListener. While you have to be careful while using it and control the X and Y values of the layout.

Android - Custom View and ImageView on XML but Custom View not visible

I try to use setContentView (R.layout.main) to display both an imageview and a Custom View. Somehow only the imageview can be shown but the Custom view is not visible (i.e. Bitmap ButtonStart not visible). I tested my code for onDraw and Texture class (responsible to load a bitmap object) somewhere else and it works fine. So I dunno what goes wrong...
Code for Custom view
public class TitleView extends View {
private Bitmap ButtonStart;
public TitleView (Context context, AttributeSet attrs) {
super (context, attrs);
Texture t2 = new Texture(context);
t2.loadFromAsset("button_Start.png");
ButtonStart = t2.getBitmap();
}
#Override
protected void onDraw (Canvas canvas) {
canvas.drawBitmap (ButtonStart, 0, 0, null);
}
}
MainActivity
public class MainActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature (Window.FEATURE_NO_TITLE);
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
WindowManager.LayoutParams.FLAG_FULLSCREEN);
setContentView(R.layout.main_screen_image);
}
}
main_screen_image.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/mainScreenLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
>
<ImageView
android:id="#+id/mainScreenImage"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scaleType="centerCrop"
android:src="#drawable/screenimage"
>
</ImageView>
<com.lowbband.chimera.TitleView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/titleview"/>
</LinearLayout>
With the code above, only screenimage was shown...
<ImageView
android:id="#+id/mainScreenImage"
android:layout_width="fill_parent"
android:layout_height="fill_parent" //it should be wrap_content otherwise it will take whole space
android:scaleType="centerCrop"
android:src="#drawable/screenimage"
>
</ImageView>
<com.lowbband.chimera.TitleView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/titleview"/>
And if the image is large and still fills the screen then put ScrollView outside LinearLayout

How to show/hide grouped views in Android?

I want to create an activity such as mentioned in photo...
as soon as I press the maximize button I want it to become full screen for the activity and part 1 become minimize, and again when I press the restore button I want it to become in a first state: to be able to see part 1 and part 2 ...
I think if we put two layouts it is possible? Isn't it? Please refer me to a resource to help me about this, or show me the code to achieve a solution.
Part one and two should be in their own layout. After, play with the visilibity property of each layout. Specifically to hide any view without it continues to occupy its space, use the value gone for the visibility property.
Ok, here I go. Below you have a complete example of how to hide/show grouped views.
main.xml
<RelativeLayout 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" >
<LinearLayout
android:id="#+id/viewsContainer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="5dp" >
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="TextBox One" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="TextBox Two" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="TextBox Three" />
</LinearLayout>
<Button
android:id="#+id/button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="Hide" />
</RelativeLayout>
Activity
public class MyActivity extends Activity implements OnClickListener {
private boolean viewGroupIsVisible = true;
private View mViewGroup;
private Button mButton;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
mViewGroup = findViewById(R.id.viewsContainer);
mButton = findViewById(R.id.button);
mButton.setOnClickListener(this);
}
#Override
public void onClick(View button) {
if (viewGroupIsVisible) {
mViewGroup.setVisibility(View.GONE);
mButton.setText("Show");
} else {
mViewGroup.setVisibility(View.VISIBLE);
mButton.setText("Hide");
}
viewGroupIsVisible = !viewGroupIsVisible;
}
I hope this helps ;)
There is a bit simplified solution, than Diego Palomar produced, without using additional variable. I'll take his code to show:
public class MyActivity extends Activity implements OnClickListener {
private View mViewGroup;
private Button mButton;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
mViewGroup = findViewById(R.id.viewsContainer);
mButton = findViewById(R.id.button);
mButton.setOnClickListener(this);
}
#Override
public void onClick(View button) {
if (mViewGroup.getVisibility() == View.VISIBLE) {
mViewGroup.setVisibility(View.GONE);
mButton.setText("Show");
} else {
mViewGroup.setVisibility(View.VISIBLE);
mButton.setText("Hide");
}
}

Categories

Resources