How to get a Gesture View like in official Facebook app - android

I want to implement the same behaviour of the notification view in the official Facebook app.
The "notifications" tab are at the bottom and can drag/drop via fingers to full screen.
How can i do that?
I've tried it via ViewFlipper and Animation.... But no success.
Does anyone know how we can do this?
The app "Zedge" has the same in the "search" function.
Via drag/drop you can open the "search" view.

Those Apps are using a SlidingDrawer. The SlidingDrawer will do all the opening and closing for you only have to define the content view and the view for the handle.
It is the same view that is also used as the application drawer on the home screen.

Additionally, here is a litte demo how the SlideingDrawer is used:
/src - SliderActivity.java:
import android.app.Activity;
import android.os.Bundle;
import android.widget.Button;
import android.widget.SlidingDrawer;
import android.widget.SlidingDrawer.OnDrawerCloseListener;
import android.widget.SlidingDrawer.OnDrawerOpenListener;
public class SliderActivity extends Activity {
Button slideHandleButton;
SlidingDrawer slidingDrawer;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
slideHandleButton = (Button) findViewById(R.id.slideHandleButton);
slidingDrawer = (SlidingDrawer) findViewById(R.id.SlidingDrawer);
slidingDrawer.setOnDrawerOpenListener(new OnDrawerOpenListener() {
#Override
public void onDrawerOpened() {
slideHandleButton.setBackgroundResource(R.drawable.arrowdown);
}
});
slidingDrawer.setOnDrawerCloseListener(new OnDrawerCloseListener() {
#Override
public void onDrawerClosed() {
slideHandleButton.setBackgroundResource(R.drawable.arrowup);
}
});
}
}
/res/layout - main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:id="#+id/LinearLayout01"
android:layout_width="fill_parent" android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:gravity="bottom">
<SlidingDrawer android:layout_width="wrap_content"
android:id="#+id/SlidingDrawer" android:handle="#+id/slideHandleButton"
android:content="#+id/contentLayout" android:padding="10dip"
android:layout_height="200dip">
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content" android:id="#+id/slideHandleButton"
android:background="#drawable/arrowup"></Button>
<LinearLayout android:layout_width="wrap_content"
android:id="#+id/contentLayout" android:orientation="vertical"
android:gravity="center|top" android:padding="10dip"
android:background="#505050" android:layout_height="wrap_content">
<TextView android:id="#+id/TextView01" android:layout_width="wrap_content"
android:layout_height="fill_parent" android:layout_weight="8" android:text="Hello Slider"></TextView>
<Button android:id="#+id/Button02" android:layout_weight="2" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:text="Do anything"></Button>
</LinearLayout>
</SlidingDrawer>
</LinearLayout>
Additionally you need to images in your /res/drawable folder - in this case like arrowup.png and arrowdown.png
If you put that all together it turns out to look like that:

Related

Change Picture when you click on a button

Goal:
When I click on the button throw, a picture should be exchanged into another picture in real time.
Problem:
What is wrong with the code? I have to press twice in order to change the picture.
Info:
*Using Android API 25 and using the tool android studio
package com.jfdimarzio.dice;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;
public class MainActivity extends AppCompatActivity
{
ImageView image;
#Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
public void throwDice(View v)
{
image = (ImageView) findViewById(R.id.dice_grey_3);
Button button = (Button) findViewById(R.id.btnThrow);
button.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View arg0)
{
image.setImageResource(R.drawable.red1);
}
});
}
}
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context="com.jfdimarzio.dice.MainActivity">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!" />
<Button
android:text="Throw"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/btnThrow"
android:paddingLeft="50dp"
android:paddingRight="50dp"
android:paddingBottom="20dp"
android:paddingTop="20dp"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:onClick="throwDice"
android:layout_alignParentStart="true" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/grey1"
android:id="#+id/dice_grey_1"
android:layout_alignParentTop="true"
android:layout_alignParentStart="true" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:srcCompat="#drawable/grey2"
android:id="#+id/dice_grey_2"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:srcCompat="#drawable/grey3"
android:id="#+id/dice_grey_3"
android:layout_alignParentTop="true"
android:layout_alignParentEnd="true" />
</RelativeLayout>
Since you specify the onclick for the button here: android:onClick="throwDice" it will register it. But when it is clicked again the method throwDice will register another onclick listener thus change the old listener with the new one. And when click again it will trigger the new listener to change the image which will execute this:
image.setImageResource(R.drawable.red1);
Now you need to only register the listener once only. Ether by xml or programatically.
QUICK FIX:
public void throwDice(View v)
{
image = (ImageView) findViewById(R.id.dice_grey_3);
Button button = (Button) findViewById(R.id.btnThrow);
image.setImageResource(R.drawable.red1);
}
Why do this work?
There are two ways to listen to a click in Android, either programmatically using Java or using XML . What you've done is you've implemented both these nested. In the end it takes two clicks to get the end result. Either you can use the onClickListener() or the throwDice() method which you've defined in the XML : android:onClick="throwDice"

Could not click on the buttons in SlidingDrawer

I have a problem with SlidingDrawer. All buttons in it could not be click.
Here is my xml file for SlidingDrawer:
<?xml version="1.0" encoding="utf-8"?>
<SlidingDrawer xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="110dp"
android:content="#+id/content"
android:handle="#+id/handle">
<Button
android:id="#+id/handle"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:text="#string/menu" />
<LinearLayout
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="80dp"
android:layout_gravity="center"
>
<Button
android:id="#+id/btn_video"
style="#style/button_menu_bottom"
android:drawableTop="#drawable/mnu_video"
android:text="#string/video" />
...
...
</LinearLayout>
</SlidingDrawer>
Here is my java file extended from SlidingDrawer
package com.example;
import android.content.Context;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.widget.Button;
import android.widget.LinearLayout;
import android.widget.SlidingDrawer;
import com.example.R;
public class BottomMenuBar extends SlidingDrawer {
private SlidingDrawer mSlidingDrawer;
private Button mButtonSlidingDrawer;
private LinearLayout mLayoutContent;
private Button mButtonVideo;
private Button mButtonPhoto;
private Button mButtonChat;
private Button mButtonSetting;
public BottomMenuBar2(Context context, AttributeSet attrs) {
super(context, attrs);
String infService = Context.LAYOUT_INFLATER_SERVICE;
LayoutInflater li;
li = (LayoutInflater) getContext().getSystemService(infService);
li.inflate(R.layout.bar_bottom_menu, this, true);
mSlidingDrawer=(SlidingDrawer)findViewById(R.id.sld_bottom_menu);
mButtonSlidingDrawer=(Button)findViewById(R.id.handle);
mLayoutContent=(LinearLayout)findViewById(R.id.content);
mButtonVideo=(Button)findViewById(R.id.btn_video);
mButtonSetting=(Button)findViewById(R.id.btn_setting);
}
public Button getmButtonSlidingDrawer() {
return mButtonSlidingDrawer;
}
public void setmButtonSlidingDrawer(Button mButtonSlidingDrawer) {
this.mButtonSlidingDrawer = mButtonSlidingDrawer;
}
...
Setter & Getter methods
...
}
Here is my main.xml file:
<?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:background="#drawable/bg_main"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0.1" >
...
Any content
...
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<com.example.BottomMenuBar
android:id="#+id/sld_bottom_menu"
android:layout_width="wrap_content"
android:layout_height="110dp"
android:handle="#+id/handle"
android:content="#+id/content"
/>
</LinearLayout>
</LinearLayout>
For my buttons in sliding drawers, I tell each button what method to use in the xml with android:onClick.
<Button
android:id="#+id/sortbutton"
android:layout_width="0dp"
android:layout_height="35dp"
android:layout_weight="1"
android:onClick="SortClickHandler"
android:text="#string/sd_sortmethod_button"
android:textSize="12dp" />
And then define the method in whatever activity is appropriate:
public void SortClickHandler(View v) {
// Do stuff here
}
EDIT
I think I found your issue. From the developer docs here it says, and I quote:
SlidingDrawer should be used as an overlay inside layouts. This means SlidingDrawer
should only be used inside of a FrameLayout or a RelativeLayout for instance.
So, I think if you change your layout to a RelativeLayout you will find that your buttons will work. I just double-checked all of my uses of a sliding drawer and in all cases the root element of the view containing it is a RelativeLayout.
I don't understand why you're extending SlidingDrawer.
You should look up the documentation here.
<SlidingDrawer
android:id="#+id/drawer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:handle="#+id/handle"
android:content="#+id/content">
<ImageView
android:id="#id/handle"
android:layout_width="88dip"
android:layout_height="44dip" />
<FrameView
android:id="#id/content"
android:layout_width="match_parent"
android:layout_height="match_parent">
[INSERT VIEWS HERE]
<FrameView>
</SlidingDrawer>
In your Activity you don't even technically need to gain access to the SlidingDrawer object (The sliding functionality is already in place as standard, it simply contains the the view's in content, you don't need to interfere).
From your Activity gain reference to the view's you add in [INSERT VIEWS HERE]. You can then do setOnClickListener() on each of these buttons.

Problems with buttons in a Dialog

I have a custom Dialog that shows a few buttons. The idea is to have a scrollable Dialog where one can choose a number or letter from 0 to 9, or 0 to F or 0 to Z ...
So my first problem is how do I add these buttons through code and not xml since there is a variable number of buttons each time. Even the simplest code crashes on me so I'm probably not doing anything right.
Also the code I have with a few xml buttons chrashes when I click on the buttons saying it can't find the onClick function. As you can see I have android:onClick="onClickDialogbutton" in my button xml and the function does exist in my java code but still it crashes.
Hope someone can take look at the code and help me with adding buttons programatically and get the onClick to work.
Here is my code:
DialogTestActivity.java:
package com.test.dialog;
import android.app.Activity;
import android.app.Dialog;
import android.os.Bundle;
import android.view.View;
import android.view.Window;
import android.widget.Button;
import android.widget.LinearLayout;
public class DialogTestActivity extends Activity {
Dialog dialog;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
}
public void onClickStartDialog( View view ) {
dialog = new Dialog( this );
dialog.requestWindowFeature( Window.FEATURE_NO_TITLE );
dialog.setContentView( R.layout.dialog );
dialog.setCancelable( true );
dialog.show();
// I here wish to add buttons through code and not xml.
// This gives an error as it is now.
Button button = new Button( this );
( ( LinearLayout )findViewById( R.id.Buttons ) ).addView( button );
}
public void onClickDialogButton( View view ) {
dialog.dismiss();
}
}
Main.xml:
<?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" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:onClick="onClickStartDialog"
android:text="Start Dialog" />
</LinearLayout>
Dialog.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="54dip"
android:layout_height="150dip"
android:gravity="center" >
<ScrollView
android:layout_width="48dip"
android:layout_height="144dip" >
<LinearLayout
android:id="#+id/Buttons"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<Button
android:id="#+id/ButtonId0"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:onClick="onClickDialogbutton"
android:text="0"
android:textSize="32dip" />
<Button
android:id="#+id/ButtonId1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:onClick="onClickDialogbutton"
android:text="1"
android:textSize="32dip" />
<Button
android:id="#+id/ButtonId2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:onClick="onClickDialogbutton"
android:text="2"
android:textSize="32dip" />
</LinearLayout>
</ScrollView>
</RelativeLayout>
You probably need to call findViewById on the dialog. Simply calling findViewById inside of your Activity will try to find a view or child view currently being displayed in your activity with the specified id. In this case that is probably returning null, hence the crash. Try it again with dialog.findViewById...

For designing dynamic layout in android like the status bar in the home screen

How to make a layout in android like the status bar in the home screen which allows the user to drag the status bar up to any height. The layout should also allow the user with a flick up or down to expand or contract the the layout fully.
Do you mean something like a SlidingDrawer?
Can be used like this:
/src - SliderActivity.java:
import android.app.Activity;
import android.os.Bundle;
import android.widget.Button;
import android.widget.SlidingDrawer;
import android.widget.SlidingDrawer.OnDrawerCloseListener;
import android.widget.SlidingDrawer.OnDrawerOpenListener;
public class SliderActivity extends Activity {
Button slideHandleButton;
SlidingDrawer slidingDrawer;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
slideHandleButton = (Button) findViewById(R.id.slideHandleButton);
slidingDrawer = (SlidingDrawer) findViewById(R.id.SlidingDrawer);
slidingDrawer.setOnDrawerOpenListener(new OnDrawerOpenListener() {
#Override
public void onDrawerOpened() {
slideHandleButton.setBackgroundResource(R.drawable.arrowdown);
}
});
slidingDrawer.setOnDrawerCloseListener(new OnDrawerCloseListener() {
#Override
public void onDrawerClosed() {
slideHandleButton.setBackgroundResource(R.drawable.arrowup);
}
});
}
}
/res/layout - main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:id="#+id/LinearLayout01"
android:layout_width="fill_parent" android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:gravity="bottom">
<SlidingDrawer android:layout_width="wrap_content"
android:id="#+id/SlidingDrawer" android:handle="#+id/slideHandleButton"
android:content="#+id/contentLayout" android:padding="10dip"
android:layout_height="200dip">
<Button android:layout_width="wrap_content"
android:layout_height="wrap_content" android:id="#+id/slideHandleButton"
android:background="#drawable/arrowup"></Button>
<LinearLayout android:layout_width="wrap_content"
android:id="#+id/contentLayout" android:orientation="vertical"
android:gravity="center|top" android:padding="10dip"
android:background="#505050" android:layout_height="wrap_content">
<TextView android:id="#+id/TextView01" android:layout_width="wrap_content"
android:layout_height="fill_parent" android:layout_weight="8" android:text="Hello Slider"></TextView>
<Button android:id="#+id/Button02" android:layout_weight="2" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:text="Do anything"></Button>
</LinearLayout>
</SlidingDrawer>
</LinearLayout>
You need 2 images in your /res/drawable folder to make it work, like arrowup.png and arrowdown.png in this example

What is this Control or View?

Please see the Image
hello I want to use this type of Layout in my application
If I drag one layout to any direction then i want to display other Layout
is it possible please help me
Try that
Main.java:
import android.app.Activity;
import android.os.Bundle;
import android.widget.ImageView;
import android.widget.SlidingDrawer;
import android.widget.SlidingDrawer.OnDrawerScrollListener;
public class Main extends Activity {
SlidingDrawer mSlide;
ImageView mImageSlideHandle;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
mSlide = ((SlidingDrawer)findViewById(R.id.slide));
mImageSlideHandle = ((ImageView)findViewById(R.id.handle));
mSlide.setOnDrawerScrollListener(new OnDrawerScrollListener(){
#Override
public void onScrollEnded() {
if (mSlide.isOpened()) {
mImageSlideHandle.setImageResource(R.drawable.ic_tray_expand);
} else {
mImageSlideHandle.setImageResource(R.drawable.ic_tray_collapse);
}
}
#Override
public void onScrollStarted() {
}
});
}
}
main.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/hello" />
<SlidingDrawer
android:layout_height="wrap_content"
android:handle="#+id/handle"
android:content="#+id/content"
android:id="#+id/slide"
android:layout_width="fill_parent"
android:orientation="vertical" >
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#id/handle"
android:src="#drawable/ic_tray_expand"
android:background="#drawable/handle" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#id/content"
android:background="#FFFFFFFF"
android:gravity="center" >
<Button
android:text="Button01"
android:id="#+id/Button01"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<Button
android:text="Button02"
android:id="#+id/Button02"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
</SlidingDrawer>
</LinearLayout>
you can use a SlidingDrawer ,
follow this link SlidingDrawer Tutorial
Hope it helps :)
http://techdroid.kbeanie.com/2009/08/android-sliding-drawer-example.html
http://www.androidpeople.com/android-sliding-drawer-tutorial
This is android SlidingDrawer to use this follow the above link
You could a sliding drawer or u could use the interpolator to do the same stuff

Categories

Resources