Swipe to Add view in android - android

I want to achieve something like the below gif:
What I have done so far:
I am using a swipelayout using I am able to implement the part where if you swipe the row item, it shows you the "Add to Cart" icon but I am not able to implement the animation where it zooms in the cart icon and add it to cart (I am not able to create a hook where I can call the addToCart function).
Below is my code:
Row XML File:
<RelativeLayout
android:id="#+id/swipe_view"
android:layout_width="120dp"
android:layout_height="match_parent"
android:background="#color/colorPrimary"
android:minWidth="96dp">
<ImageView
android:id="#+id/add_to_cart"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:layout_marginLeft="#dimen/activity_margin"
android:layout_marginStart="#dimen/activity_margin"
android:background="?attr/selectableItemBackgroundBorderless"
android:clickable="true"
android:padding="#dimen/activity_margin"
android:scaleType="center"
android:src="#drawable/ic_menu_cart"/>
</RelativeLayout>
<RelativeLayout
android:id="#+id/restaurant_menu_details_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="#dimen/half_activity_margin"
android:paddingLeft="#dimen/activity_margin"
android:paddingRight="#dimen/activity_margin"
android:paddingTop="#dimen/half_activity_margin">
<ImageView
android:id="#+id/item_image"
android:layout_width="56dp"
android:layout_height="56dp"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:scaleType="centerCrop"
tools:src="#drawable/placeholder_restaurant"/>
<TextView
android:id="#+id/item_price"
style="#style/secondary_tv"
fontPath="#string/ubuntu_light"
android:layout_width="48dp"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginBottom="#dimen/half_activity_margin"
android:layout_marginLeft="#dimen/half_activity_margin"
android:gravity="center_horizontal"
android:maxLines="2"
tools:text="5KD"/>
<LinearLayout
android:id="#+id/restaurant_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toEndOf="#+id/item_image"
android:layout_toLeftOf="#+id/item_price"
android:layout_toRightOf="#+id/item_image"
android:layout_toStartOf="#+id/item_price"
android:orientation="vertical">
<TextView
android:id="#+id/item_name"
fontPath="#string/ubuntu_mono_regular"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/half_activity_margin"
android:layout_marginTop="#dimen/half_activity_margin"
android:gravity="start"
android:textAllCaps="true"
android:textColor="#color/black_primary_text_color"
android:textSize="#dimen/medium_text"
tools:text="Restaurant Name"/>
<TextView
android:id="#+id/item_desc"
style="#style/secondary_tv"
fontPath="#string/ubuntu_light"
android:layout_marginBottom="#dimen/half_activity_margin"
android:layout_marginLeft="#dimen/half_activity_margin"
android:layout_marginTop="4dp"
android:ellipsize="end"
android:maxLines="2"
tools:text="Restaurant Description, max 1 line"/>
</LinearLayout>
</RelativeLayout>
Java Code
from RecyclerView Adapter:
SwipeLayout swipeLayout = (SwipeLayout) itemView.findViewById(R.id.swipe);
swipeLayout.addSwipeListener(new SwipeLayout.SwipeListener() {
#Override
public void onStartOpen(SwipeLayout layout) {
}
#Override
public void onOpen(SwipeLayout layout) {
}
#Override
public void onStartClose(SwipeLayout layout) {
}
#Override
public void onClose(SwipeLayout layout) {
}
#Override
public void onUpdate(SwipeLayout layout, int leftOffset, int topOffset) {
// i tried leveraging the leftOffset which tells me the position of the //layout on the screen but because it is called multiple times, It was //adding many entries to the cart in just one swipe :(
}
#Override
public void onHandRelease(SwipeLayout layout, float xvel, float yvel) {
}
});
I would really appreciate if anyone can suggest a better way to fix this or any open-source library which does such a thing.
Many thanks!
PS: Please add a comment if you need more information from me in order to help me. :)

what I'll write is a best guess based on the information you gave, but it seems that it's all right there:
#Override
public void onUpdate(SwipeLayout layout, int leftOffset, int topOffset) {
float percent = ((float)leftOffset/((float)totalWidth));
// use `percent` to animate the icon, something like:
icon.setAlpha(percent);
}
#Override
public void onOpen(SwipeLayout layout) {
// here is the swipe fully open
addToCart(item); // create the method
layout.close(); // close the layout again
}

Related

How to delete space when I hide a CardView

How can I delete the space when I hide a CardView? I doing an app with android and Firebase and I show the information from firebase in cardviews, but when the info isn't correct the cardview must disappear. The point is that the cardview disappear, but still uses a space in the layout, I've tried the answers in
setVisibility(GONE) view becomes invisible but still occupies space But it doesn't work for me.
#Override
protected void onStart() {
super.onStart();
firebaseAuth.addAuthStateListener(firebaseAuthListener);
final FirebaseRecyclerAdapter<CursosDB, MainActivity.CursosPViewHolder> firebaseRecyclerAdapter =
new FirebaseRecyclerAdapter<CursosDB, MainActivity.CursosPViewHolder>(
CursosDB.class,
R.layout.design_row_cursos,
MainActivity.CursosPViewHolder.class,
myRef)
{
#Override
protected void populateViewHolder(MainActivity.CursosPViewHolder viewHolder, final CursosDB Cmodel, int position)
{
String estado = Cmodel.getSTATUS().toString();
if (estado.equals("OK")){
viewHolder.setPhotoURL(getApplicationContext(), Cmodel.getURI());
viewHolder.setTitle(Cmodel.getTITLE());
viewHolder.setCiudad(Cmodel.getPLACE());
viewHolder.setLevel(Cmodel.getLEVEL());
viewHolder.setDur(Cmodel.getDURACION());
viewHolder.setPrice(Cmodel.getCOSTO());
}else{
RecyclerView.LayoutParams layoutParams = (RecyclerView.LayoutParams) viewHolder.mView.getLayoutParams();
layoutParams.setMargins(0,0,0,0);
viewHolder.mView.setLayoutParams(layoutParams);
viewHolder.mView.setVisibility(View.INVISIBLE);
viewHolder.mView.setVisibility(View.GONE);
//viewHolder.mView.setVisibility(View.GONE);
//Toast.makeText(getApplicationContext(), "Ningún curso aprobado aún", Toast.LENGTH_SHORT).show();
}
viewHolder.mView.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
// Toast.makeText(getApplicationContext(), Cmodel.getUSERID(), Toast.LENGTH_LONG).show();
//Toast.makeText(getApplicationContext(), Cmodel.getTITLE(), Toast.LENGTH_SHORT).show();
//Toast.makeText(UsersList.this, user_key, Toast.LENGTH_LONG).show();
}
});
}
};
mCourses.setAdapter(firebaseRecyclerAdapter);
}
This is my layout:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/cardview_cursos"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="4dp"
android:onClick="positionAction"
android:padding="4dp"
android:paddingBottom="4dp"
android:paddingEnd="4dp"
android:paddingStart="4dp"
android:paddingTop="4dp"
app:cardElevation="4dp">
<LinearLayout android:id="#+id/layout_to_hide"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/Cimg"
android:layout_width="match_parent"
android:layout_height="165dp"
android:scaleType="center"
app:srcCompat="#drawable/knowit_logo" />
<TextView
android:id="#+id/Ctitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_below="#+id/Cimg"
android:layout_marginLeft="14dp"
android:layout_marginStart="14dp"
android:paddingTop="8dp"
android:text="Titulo"
android:textStyle="bold" />
<TextView
android:id="#+id/Clugar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/Ctitle"
android:layout_alignStart="#+id/Ctitle"
android:layout_below="#+id/Ctitle"
android:layout_marginTop="10dp"
android:text="Lugar" />
<TextView
android:id="#+id/textView29"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/Clugar"
android:layout_alignStart="#+id/Clugar"
android:layout_below="#+id/Clugar"
android:layout_marginTop="10dp"
android:text="$" />
<TextView
android:id="#+id/Cprice"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/textView29"
android:layout_marginBottom="4dp"
android:layout_toEndOf="#+id/textView29"
android:layout_toRightOf="#+id/textView29"
android:paddingLeft="5dp"
android:text="0.0" />
<TextView
android:id="#+id/Cdur"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/Clugar"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_marginEnd="126dp"
android:layout_marginRight="126dp"
android:text="Duración" />
<TextView
android:id="#+id/Cnivel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/Cprice"
android:layout_alignLeft="#+id/Cdur"
android:layout_alignStart="#+id/Cdur"
android:layout_marginBottom="0dp"
android:text="Nivel" />
</RelativeLayout>
</LinearLayout> </android.support.v7.widget.CardView>
This is the mView:
public static class CursosPViewHolder extends RecyclerView.ViewHolder {
View mView;
public CursosPViewHolder(final View itemView) {
super(itemView);
mView = itemView;
}
public void setTitle(String title){
TextView post_title = (TextView)mView.findViewById(R.id.Ctitle);
post_title.setText(title);
}
public void setCiudad (String ciudad){
TextView post_city = (TextView)mView.findViewById(R.id.Clugar);
post_city.setText(ciudad);
}
public void setPhotoURL(Context ctx, String pgotouserurl) {
ImageView post_image =(ImageView)mView.findViewById(R.id.Cimg);
Picasso.with(ctx).load(pgotouserurl).into(post_image);
} }
I hope you can help me.
First the XML code you've posted ils wrong closed,(must finish with a CardView tag)
On addition be sure you're pointing the CardView layout with mView field ans Only use GONE or INVISIBLE,
INVISIBLE change your Panel ( Root view ) structure but GONE don't

Butter Knife - Listeners For Buttons inside include

I have simple Relative layout with one button.
And Im using this layout multiple times using include in Main Layout.
Its possible to write one method (using ButterKnife or not) for all this buttons using listener(this) and not creating multiple listeners like this ---->
(relativeLayout1.findViewById(R.id.currencyButton)).setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Toast.makeText(ForeignExchangeActivity.this, "Euro", Toast.LENGTH_SHORT).show();
}
});
(relativeLayout2.findViewById(R.id.currencyButton)).setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Toast.makeText(ForeignExchangeActivity.this, "GBP", Toast.LENGTH_SHORT).show();
}
});
Single item layaout
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorBackgroundSeekbar">
<TextView
android:id="#+id/currencyTitle"
android:text="EUR - PLN"
android:padding="5dp"
android:textSize="20sp"
android:textStyle="bold"
android:textColor="#FFFFFF"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:background="#color/colorButtonHiglight"/>
<TextView
android:id="#+id/currencyDate"
android:layout_below="#id/currencyTitle"
android:text="24-01-2015"
android:textStyle="bold"
android:layout_marginTop="12dp"
android:gravity="center_horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/currencyValue"
android:layout_below="#+id/currencyDate"
android:text="4.4567"
android:layout_marginTop="12dp"
android:textColor="#FFFFFF"
android:textStyle="bold"
android:textSize="25sp"
android:paddingTop="10dp"
android:paddingBottom="10dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:layout_centerHorizontal="true"
android:gravity="center_horizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/colorCalculatorActivity"/>
<TextView
android:text="Inna data"
android:textAllCaps="false"
android:layout_marginTop="10dp"
android:id="#+id/currencyButton"
android:textSize="12sp"
android:padding="5dp"
android:gravity="center"
android:layout_below="#id/currencyValue"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:background="#drawable/button_rounder_corners"
android:layout_alignLeft="#+id/currencyValue"
android:layout_alignRight="#+id/currencyValue"
android:onClick="onClickDataButton"
/>
<View
android:layout_marginTop="10dp"
android:layout_below="#id/currencyButton"
android:layout_width="match_parent"
android:layout_height="1dp"/>
</RelativeLayout>
Example Inlcude
<LinearLayout
android:layout_width="match_parent"
android:weightSum="2"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_marginTop="#dimen/activity_horizontal_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin">
<include
android:id="#+id/currency1"
android:layout_height="wrap_content"
android:layout_width="0dp"
android:layout_weight="1"
layout="#layout/single_item_foreign_exchange"/>
<View
android:layout_width="10dp"
android:layout_height="match_parent"/>
<include
android:id="#+id/currency2"
android:layout_height="wrap_content"
android:layout_width="0dp"
android:layout_weight="1"
layout="#layout/single_item_foreign_exchange"/>
</LinearLayout>
Binded inlcude layaouts
#Bind(R.id.currency1) RelativeLayout relativeLayout1;
#Bind(R.id.currency2) RelativeLayout relativeLayout2;
SOLVED
Added onClick method to my RelativeLayaout. Then created something like this
public void onClickDataButton(View view){
if (view == buttonEuro){
Toast.makeText(ForeignExchangeActivity.this, "Euro", Toast.LENGTH_SHORT).show();
} else if ( view == buttonGBP){
Toast.makeText(ForeignExchangeActivity.this, "GBP", Toast.LENGTH_SHORT).show();
}
}
And my button looks like
buttonEuro = (TextView) relativeLayout1.findViewById(R.id.currencyButton);
buttonGBP = (TextView) relativeLayout2.findViewById(R.id.currencyButton
);
so the same button id but finded in diffrent layaouts.
EDIT: Example for your case added: Buttons with same ID in different layouts.
1) You could iterate over an Array of Buttons.
2) Or: Create a custom Button-Class which holds anything custom you need (i.e. field for currency etc) and use that in your Layout.
Kind of Pseudocode (not tested):
class CurrencyButton extends android.widget.Button {
string currency;
public void init(Context ctx, String currency) {
this.currency = currency;
this.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Toast.makeText(ctx, this.currency, Toast.LENGTH_SHORT).show();
}
});
}
public void doSomeOtherFancyCurrencyLogicHere() {
....
}
}
This can be used in your Layout files: (Pseudo)
<your.package.CurrencyButton
id="#+id/currency_button_eur"
LayoutParams etc />
<your.package.CurrencyButton
id="#+id/currency_button_gbp"
LayoutParams etc />
<!-- EDIT: as in your example with layouts in single_item_foreign_exchange -->
<your.package.CurrencyButton
id="#+id/currency_button"
LayoutParams etc />
If you use Butterknife
#InjectView(R.id.currency_button_eur)
your.package.CurrencyButton buttonEUR;
#InjectView(R.id.currency_button_gbp)
your.package.CurrencyButton buttonGBP;
// ... initialize them somewhere
buttonEUR.init(this, "EUR");
buttonGPB.init(this, "GBP");
// EDIT: as in your example with layouts
((your.package.CurrencyButton) relativeLayout1.findViewById(R.id.currencyButton)).init(this, "EUR");
((your.package.CurrencyButton) relativeLayout2.findViewById(R.id.currencyButton)).init(this, "GBP");
Actually you could go even further and extend this class for each currency, but this should do it in the first place.
Ok, I've seen you have SOLVED your question. But since I was already working on this answer, I'll add it here anyway :P
class CurrencyLayout extends FrameLayout {
String currency;
// Constructors that calls init after super(...);
public void init(Context ctx, AtributeSet attrs) {
View includedLayout = LayoutInflater.fromContext(ctx).inflate(R.layout.single_item_foreign_exchange, this, false);
TypedArray a = context.getTheme().obtainStyledAttributes(
attrs,
R.styleable.CurrencyLayout,
0, 0);
try {
final String currency = a.getString(R.styleable.CurrencyLayout_currencyName);
} finally {
a.recycle();
}
includedLayout.findViewById(R.id.currencyName).setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Toast.makeText(ctx, this.currency, Toast.LENGTH_SHORT).show();
}
});
}
this.addView(includedLayout);
}
inside res/values/attrs.xml add something like this:
<resources>
<declare-styleable name="CurrencyLayout">
<attr name="currencyName" format="string" />
</declare-styleable>
</resources>
And inside your Activity layout:
<LinearLayout
android:layout_width="match_parent"
android:weightSum="2"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_marginTop="#dimen/activity_horizontal_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin">
<your_package.CurrencyLayout
android:id="#+id/currency1"
android:layout_height="wrap_content"
android:layout_width="0dp"
android:layout_weight="1"
custom:currencyName="GBP"/>
<View
android:layout_width="10dp"
android:layout_height="match_parent"/>
<your_package.CurrencyLayout
android:id="#+id/currency2"
android:layout_height="wrap_content"
android:layout_width="0dp"
android:layout_weight="1"
custom:currencyName="EUR"/>
</LinearLayout>
I hope this helps you anyway :D
More information on custom views and attributes

how to overlap a layout with image view and text over the other layout as a stack/pile

I am in a weird situation in my existing project. In my project i want to inflate one layout over the other as a stack dynamically. At present in my project i managed to show the layouts one below the other vertically by appending them, this approach has been chosen by me because even though i am trying to show it as stack only one image is appearing at the front during runtime instead of a bunch. In order to understand my problem please go through the following image links and code
desired result
acquired_result_when_tried_to_acheive_desired_result
approached way
Parent layout:
<LinearLayout android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/imagegallery"
android:orientation="vertical"></LinearLayout>
child layout:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<RelativeLayout
android:id="#+id/relativeImage"
android:layout_width="match_parent"
android:layout_height="250dp"
android:layout_below="#+id/rl1"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="15dp" >
<RelativeLayout
android:id="#+id/parent"
android:layout_width="wrap_content"
android:layout_height="250dp"
android:orientation="vertical" >
<Button
android:id="#+id/left1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:background="#drawable/close" />
<Button
android:id="#+id/right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:background="#drawable/right" />
<ImageView
android:id="#+id/image"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:adjustViewBounds="true"
android:background="#drawable/deelpizza"
android:paddingBottom="15dp"
android:paddingEnd="0dp"
android:paddingStart="0dp"
android:scaleType="fitCenter" />
<RelativeLayout
android:id="#+id/left"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignTop="#+id/image"
android:background="#drawable/text_bg" >
<ImageView
android:id="#+id/imageprew"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp"
android:layout_marginTop="15dp"
android:background="#drawable/icon_3" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/imageprew"
android:text="This is an exclusive Deel good for today only clime this deel before its close!"
android:textColor="#FFFFFF" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="15dp"
android:layout_below="#+id/imageprew" >
</RelativeLayout>
</RelativeLayout>
<!--
<Button
android:id="#+id/left"
android:layout_width="match_parent"
android:layout_height="80dp"
android:layout_alignParentLeft="true"
android:background="#drawable/text_bg"
android:layout_alignTop="#+id/image"
/>
-->
</RelativeLayout>
</RelativeLayout>
<RelativeLayout
android:id="#+id/relativeDetails"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/relativeImage"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:background="#drawable/rectangle" >
<TextView
android:id="#+id/locationText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/descText"
android:layout_marginLeft="10dp"
android:layout_marginTop="8dp"
android:text="woodfire pizza, Los Gatos CA\nLimited time offer, redeemable today only."
android:textColor="#000000" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="10dp"
android:layout_below="#+id/locationText" />
<TextView
android:id="#+id/descText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="8dp"
android:text="1 large, 2 topping pizza"
android:textColor="#000000"
android:textSize="20dp"
android:textStyle="bold" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="10dp"
android:text="$15"
android:textColor="#FF0000"
android:textSize="25dp" />
</RelativeLayout>
JavaCode:
private void addImagesToThegallery() {
LinearLayout imageGallery = (LinearLayout)findViewById(R.id.imagegallery);
//imageGallery.setPadding(0, 0, 0, 30);
LayoutInflater layoutInfralte=(LayoutInflater)getApplicationContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
List views=new ArrayList();
View view;
for(int j=0; j<=5; j++)
{
view=layoutInfralte.inflate(R.layout.newdeels, null);
view.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT));
views.add(view);
}
for(int i = 0; i<views.size(); i++)
{
imageGallery.addView((View) views.get(i));
}
Please go through my code and let me know where am i going wrong and let me know if i am unclear anywhere
Change the margin top to make views come down a bit
for(int j=0; j<=5; j++)
{
view=layoutInfralte.inflate(R.layout.newdeels, null);
LinearLayout.LayoutParams lp=new LayoutParams(LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT);
lp.setMargins(left,5*j, right, bottom);
view.setLayoutParams(lp);
views.add(view);
}
for(int i = 0; i<views.size(); i++)
{
imageGallery.addView((View) views.get(i));
}
Checkout following
Github : Material Recent Layout
Usage
RecentsList recents = (RecentsList) findViewById(R.id.recents);
recents.setAdapter(new RecentsAdapter() {
#Override
public String getTitle(int position) {
return "Item "+position;
}
#Override
public View getView(int position) {
ImageView iv =new ImageView(RecentsActivity.this);
iv.setImageResource(R.drawable.mazda);
iv.setBackgroundColor(0xffffffff);
return iv;
}
#Override
public Drawable getIcon(int position) {
return getResources().getDrawable(R.mipmap.ic_launcher);
}
#Override
public int getHeaderColor(int position) {
return colors[random.nextInt(colors.length)];
}
#Override
public int getCount() {
return 10;
}
}
Note
You need to modify as per your requirement.
Try FrameLayout in your parent layout. Set different margins in child views to achive an effect of stack.
Child views are drawn in a stack, with the most recently added child on top
check out : github.com/kikoso/Swipeable-Cards
As per your response :
hi thank you for your response ur response actually worked. But now i am dealing with another situation where-in i would like to update details based on swipe for eg: if a card is swiped right it should be gestured as like where as if a card is swiped left it should be gestured as dislike so how to actually code these swipe gestures can you please help me out
#ashwin for that you should have a like and dislike drawable or a custom view.
card.setOnCardDimissedListener(new CardModel.OnCardDismissedListener() {
#Override
public void onLike() {
Log.d("Swipeable Card", "I liked it");
}
#Override
public void onDislike() {
Log.d("Swipeable Card", "I did not liked it");
}
});
Use above snippet to show or hide the view of like or dislike in respective methods that is onLike() and onDislike().
Edit 1:
I figured out the problem what you are facing, If you are simply implementing the Sample Code. Then it clearly shows that CardContainer has SimpleCardStackAdapter as adapter and CardModel are added to it using new operator. Except the last element of CardModel that is added separately and cardModel Listener is applied on last element only. If you want to apply it on all elements. Then you should have to add the elements to SimpleCardStackAdapter by ArrayList of CardModel.

what is wrong with this layout, double clicks

I was trying to do something similar to this app List
But this was too hard for me, I can't understand very well the layout system, so I ended up doing something in RecyclerView with rectangular and imagebuttons in the left and two on the right. All buttons will have some functions. If you click the star it will add/remove it from favorites, the download button will download it, and the right buttons are to delete and update.
I added the function for clickListener using this code from google
public class RecyclerItemClickListener implements RecyclerView.OnItemTouchListener {
private OnItemClickListener mListener;
public interface OnItemClickListener {
public void onItemClick(View view, int position);
}
GestureDetector mGestureDetector;
public RecyclerItemClickListener(Context context, OnItemClickListener listener) {
mListener = listener;
mGestureDetector = new GestureDetector(context, new GestureDetector.SimpleOnGestureListener() {
#Override
public boolean onSingleTapUp(MotionEvent e) {
return true;
}
});
}
#Override
public boolean onInterceptTouchEvent(RecyclerView view, MotionEvent e) {
View childView = view.findChildViewUnder(e.getX(), e.getY());
if (childView != null && mListener != null && mGestureDetector.onTouchEvent(e)) {
mListener.onItemClick(childView, view.getChildPosition(childView));
}
return false;
}
#Override
public void onTouchEvent(RecyclerView view, MotionEvent motionEvent) {
}
}
and linked the Listener doing this:
mRecyclerView.addOnItemTouchListener(
new RecyclerItemClickListener(this, new RecyclerItemClickListener.OnItemClickListener() {
#Override public void onItemClick(View view, int position) {
Context context = getApplicationContext();
int duration = Toast.LENGTH_SHORT;
CharSequence text = "Item CLICKED";
Toast toast = Toast.makeText(context, text, duration);
toast.show();
}
it show Item Clicked even when i click on the ImageButton(i setted another function to it), both actions are called...
how can i make it separete the clicks?
But I think the main problem is my .xml, can someone look and see what is wrong, please? I added a lot of relatives, one is for border, another for background, and the third has the items inside =x.
Here's the item_list for the recycler.
<?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"
android:paddingTop="10dp"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/border"
android:padding="1dp"
>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:baselineAligned="false"
android:padding="5dp"
android:background="#android:color/white"
android:weightSum="1"
>
<LinearLayout android:id="#+id/thumbnail"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="5dip"
android:layout_alignParentLeft="true"
android:background="#android:color/white"
android:layout_marginRight="5dip">
<ImageButton
android:id="#+id/status"
android:background="#android:color/white"
android:layout_width="25dip"
android:layout_height="25dip"
/>
</LinearLayout>
<TextView
android:id="#+id/titulo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/thumbnail"
android:layout_toRightOf="#+id/thumbnail"
android:textColor="#040404"
android:typeface="sans"
android:background="#android:color/white"
android:textSize="15dip"
android:textStyle="bold"/>
<TextView
android:id="#+id/descricao"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textColor="#343434"
android:textSize="10dip"
android:layout_toRightOf="#+id/thumbnail"
android:background="#android:color/white"
android:layout_below="#+id/titulo" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/white"
android:paddingRight="10dp"
android:id="#+id/delete"
android:layout_toLeftOf="#+id/update"
android:padding="5dip"
android:onClick="deletarLei" />
<ImageButton android:layout_width="wrap_content"
android:id="#+id/update"
android:layout_height="wrap_content"
android:background="#android:color/white"
android:padding="5dip"
android:layout_alignParentRight="true"
/>
</RelativeLayout>
</RelativeLayout>
</RelativeLayout>
When I have similar problems, a tag on the top most ViewGroup in your layout usually solves the problem. In your case this would be the top most ViewGroup in each cell/row.
android:descendantFocusability="beforeDescendants"
You can even try setting this on your RecyclerView. There are only 3 options, from what I remember beforeDescendants should work, otherwise give the other 2 a try.
I think you can just put a OnClickListener on the image in your Adapter and just the onItemClickListener on the recycle view. Its not really clear from your code what you're doing.

Fixed buttons between scrollable content

i'm struggling with scrollview.
I want to display content (1) then buttons (2) and finally content (3).
When i'm scrolling, i want the buttons to be fixed at the top of my activity.
I can't post image, so it would be :
1
2
3
I scroll
2 (fixed at top)
3 (this part start to scroll when the 1 disapear at top)
I scroll
2 (fixed at top)
3 (still scrollable).
I m curently using this :
<ScrollView
android:id="#+id/sv_entete"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/layout_bar"
android:background="#color/gris_blanc" >
<RelativeLayout
android:id="#+id/layout_conteneur"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
// Some image etc.
</RelativeLayout>
</ScrollView>
<Button
android:id="#+id/btn_presentation_has_to_stay_on_top"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/sv_entete" />
<Button
android:id="#+id/btn_analyze_has_to_stay_on_top"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/sv_entete" />
<ScrollView
android:id="#+id/sv_presentation"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/btn_presentation"
android:background="#color/gris_blanc" >
<RelativeLayout
android:id="#+id/layout_presentation"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
// Some image etc
</RelativeLayout>
</ScrollView>
But only the second part scroll (3), the first part (1) is (obviously) not linked with the second scrollview, but i can't figured out by myself.
Any help plz ?
Looks like there's no way to implement it right out of the box. So, You need to create custom components.
Unfortunately, there's not much details in the question, so I'm not able to suggest which way is better for your case.
However, below two variants I can think of:
Have two button panels in the same layout. Initially only one panel should be visible (one inside scroll view). During scrolling, it first panel reaches top, You'll need to make second one visible. And make it invisible, when scroll up (and first one become visible inside ScrollView). It would increase complexity of layout and coe little bit (e.g. You'll need to listen two sets of buttons instead of one). In simple test application I haven't observed any critical issues / UI artifacts using this implementation,
For that you need to create separate layout for buttons panel, e.g. buttons_panel.xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/btn_presentation_has_to_stay_on_top"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="left button"/>
<Button
android:id="#+id/btn_analyze_has_to_stay_on_top"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="right button"/>
</LinearLayout>
Then main activity layout might look like the following (activity_main.xml):
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.alexstarc.testapp.ObservableScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/sv_entete">
<RelativeLayout
android:id="#+id/layout_conteneur"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:layout_width="match_parent"
android:layout_height="300dp"
android:id="#+id/image_1"
android:layout_alignParentTop="true"
android:background="#android:color/holo_blue_dark"
android:gravity="center"
android:textSize="30sp"
android:text="Image 1"/>
<ImageView
android:layout_width="match_parent"
android:layout_height="250dp"
android:id="#+id/image_1_1"
android:layout_centerHorizontal="true"
android:layout_below="#id/image_1"
android:src="#drawable/img1"/>
<include
layout="#layout/buttons_panel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/middle_button_panel"
android:layout_below="#id/image_1_1" />
<TextView
android:layout_width="match_parent"
android:layout_height="100dp"
android:id="#+id/image_2"
android:layout_below="#id/middle_button_panel"
android:background="#android:color/holo_green_dark"
android:gravity="center"
android:textSize="30sp"
android:text="Image 2"/>
<ImageView
android:layout_width="match_parent"
android:layout_height="350dp"
android:id="#+id/image_3"
android:layout_below="#id/image_2"
android:src="#drawable/img3"/>
<TextView
android:layout_width="match_parent"
android:layout_height="250dp"
android:id="#+id/image_4"
android:layout_below="#id/image_3"
android:background="#android:color/holo_orange_dark"
android:gravity="center"
android:textSize="30sp"
android:text="Image 4 (1)"/>
<TextView
android:layout_width="match_parent"
android:layout_height="100dp"
android:id="#+id/image_5"
android:layout_below="#id/image_4"
android:background="#android:color/holo_purple"
android:gravity="center"
android:textSize="30sp"
android:text="Image 5"/>
<TextView
android:layout_width="match_parent"
android:layout_height="350dp"
android:id="#+id/image_6"
android:layout_below="#id/image_5"
android:background="#android:color/holo_blue_dark"
android:gravity="center"
android:textSize="30sp"
android:text="Image 6"/>
<TextView
android:layout_width="match_parent"
android:layout_height="250dp"
android:id="#+id/image_7"
android:layout_below="#id/image_6"
android:background="#drawable/img1"
android:gravity="center"
android:textSize="30sp"
android:text="Image 7"/>
<TextView
android:layout_width="match_parent"
android:layout_height="250dp"
android:id="#+id/image_8"
android:layout_below="#id/image_7"
android:background="#android:color/holo_orange_dark"
android:gravity="center"
android:textSize="30sp"
android:text="Image 8"/>
<TextView
android:layout_width="match_parent"
android:layout_height="100dp"
android:id="#+id/image_9"
android:layout_below="#id/image_8"
android:background="#android:color/holo_purple"
android:gravity="center"
android:textSize="30sp"
android:text="Image 9"/>
<TextView
android:layout_width="match_parent"
android:layout_height="350dp"
android:id="#+id/image_10"
android:layout_below="#id/image_9"
android:background="#android:color/holo_blue_dark"
android:gravity="center"
android:textSize="30sp"
android:text="Image 10"/>
<TextView
android:layout_width="match_parent"
android:layout_height="250dp"
android:id="#+id/image_11"
android:layout_below="#id/image_10"
android:background="#drawable/img1"
android:gravity="center"
android:textSize="30sp"
android:text="Image 11"/>
</RelativeLayout>
</com.alexstarc.testapp.ObservableScrollView>
<include
layout="#layout/buttons_panel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/top_button_panel"
android:layout_alignParentTop="true"
android:visibility="gone" />
</RelativeLayout>
There's special custom ViewGroup - ObservableScrollView. It's needed, because ScrollView doesn't have any listeners for observing scroll position, but we need to detect then buttons panel inside it become visible. Here's its draft code (please note, I haven't done any optimization or full testing):
public class ObservableScrollView extends ScrollView {
private int mTrackViewId = 0;
private View mTrackView = null;
private int mTrackViewTop = 0;
private int mTrackViewDown = 0;
private OnViewReachTop mTopReachListener = null;
/* Helper interface to notify listener about */
public interface OnViewReachTop {
/**
* Called then View riches top
*/
void onReachTop();
/**
* Called then view leaves top position
*/
void onLeaveTop();
}
public ObservableScrollView(final Context context) {
super(context);
}
public ObservableScrollView(final Context context, final AttributeSet attrs) {
super(context, attrs);
}
public ObservableScrollView(final Context context, final AttributeSet attrs, final int defStyle) {
super(context, attrs, defStyle);
}
/**
* Sets view id to be tracked and corresponding callback
*
* #param viewId id of view to be trackked
* #param listener {#link com.alexstarc.testapp.ObservableScrollView.OnViewReachTop} to be called
*/
public void setViewTopTracking(final int viewId, final OnViewReachTop listener) {
mTrackView = findViewById(viewId);
if (mTrackView == null) {
throw new IllegalArgumentException("Passed view id should be from child of this scroll view");
}
mTrackViewId = viewId;
mTopReachListener = listener;
}
#Override
protected void onScrollChanged(final int l, final int t, final int oldl, final int oldt) {
if (mTrackViewDown == 0 && mTrackViewTop == 0) {
mTrackViewDown = mTrackView.getBottom();
mTrackViewTop = mTrackView.getTop();
}
super.onScrollChanged(l, t, oldl, oldt);
if (getScrollY() >= mTrackViewTop) {
mTopReachListener.onReachTop();
} else if (getScrollY() <= mTrackViewDown) {
mTopReachListener.onLeaveTop();
}
}
}
And activity code, which will observe current scroll position and show / hide second buttons panel:
public class MyActivity extends Activity implements ObservableScrollView.OnViewReachTop {
private static final String TAG = "MyActivity";
private View mButtonsPanel;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mButtonsPanel = findViewById(R.id.top_button_panel);
((ObservableScrollView)findViewById(R.id.sv_entete)).setViewTopTracking(R.id.middle_button_panel, this);
}
#Override
public boolean onCreateOptionsMenu(final Menu menu) {
getMenuInflater().inflate(R.menu.action_bar, menu);
return true;
}
#Override
public void onReachTop() {
mButtonsPanel.setVisibility(View.VISIBLE);
}
#Override
public void onLeaveTop() {
mButtonsPanel.setVisibility(View.GONE);
}
}
Second way: take ScrollView code, analyze it and make possible to fix some view on the top. This way is more complex, but possible to implement. Please, investigate it (if first one is not applicable to your code / layout) and ask additional questions if face some particular problems with it.

Categories

Resources