Lazarus

Programming => Operating Systems => Android => Topic started by: Agmcz on April 19, 2022, 03:53:02 am

Title: LAMW - How to set effect to imageview
Post by: Agmcz on April 19, 2022, 03:53:02 am
Hello all

I want to get effect when click on imageview, like press a button!!
Title: Re: LAMW - How to set effect to imageview
Post by: jmpessoa on April 19, 2022, 06:56:22 am

Hi, Agmcz!

What about jImageBtn component ??? 
Title: Re: LAMW - How to set effect to imageview
Post by: Agmcz on April 19, 2022, 02:08:51 pm
Quote from: jmpessoa on April 19, 2022, 06:56:22 am

Hi, Agmcz!

What about jImageBtn component ???
jImageBtn not enough
image is large, so i want to use imageview and add ripple effect on click, just like button on click

Title: Re: LAMW - How to set effect to imageview
Post by: jmpessoa on April 21, 2022, 09:36:06 pm
Quote
i want to use imageview and add ripple effect on click....

unfortunately all my attempts to implement ripple effect  for imageview  failed!


I will keep trying....


Can you point out some good java/android example?
Title: Re: LAMW - How to set effect to imageview
Post by: Agmcz on April 22, 2022, 02:27:22 am
Thank you, please don't fail 
I will also try with you "jImageView.java"
Title: Re: LAMW - How to set effect to imageview
Post by: Agmcz on April 25, 2022, 03:17:47 am
i found this code, but it is not required

onTouchEvent

DOWN:
Code: Pascal  [Select][+][-]
  1. this.getDrawable().setColorFilter(0x77000000,PorterDuff.Mode.SRC_ATOP);
  2. this.invalidate();
  3.  

UP:
Code: Pascal  [Select][+][-]
  1. this.getDrawable().clearColorFilter();
  2. this.invalidate();
  3.  
Title: Re: LAMW - How to set effect to imageview
Post by: Agmcz on April 25, 2022, 03:38:49 am
How can I modify the design of components via an xml file?
Title: Re: LAMW - How to set effect to imageview
Post by: jmpessoa on April 25, 2022, 05:21:59 am
Quote
How can I modify the design of components via an xml file?


There is a  demo  "AppApplyDrawableXMLDemo1"
Title: Re: LAMW - How to set effect to imageview
Post by: Agmcz on April 25, 2022, 08:49:29 pm
Quote from: jmpessoa on April 25, 2022, 05:21:59 am
There is a  demo  "AppApplyDrawableXMLDemo1"
Very cool, but I want to add this to "ImageView1"  :o

Code: [Select]
<ImageView
    android:id="@+id/header"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    android:scaleType="centerCrop"
    app:layout_collapseMode="parallax"
    android:clickable="true"
    android:focusable="true"
    android:background="?android:attr/selectableItemBackground"/>
Title: Re: LAMW - How to set effect to imageview
Post by: jmpessoa on April 25, 2022, 09:04:53 pm

Well, at the moment we can't....

We have no way to create a component by a xml code in LAMW....

(and this would be really important...)


But, we can try configure and reconfigure some properties and even add some missing property...


Here the relavant is:

Quote
android:background="?android:attr/selectableItemBackground"


But I still haven't learned how handle it programmatically....
Title: Re: LAMW - How to set effect to imageview
Post by: Agmcz on April 26, 2022, 05:40:14 am
Quote from: jmpessoa on April 25, 2022, 09:04:53 pm
But I still haven't learned how handle it programmatically....
pls note here
https://gist.github.com/JakeWharton/0a251d67649305d84e8a
Title: Re: LAMW - How to set effect to imageview
Post by: Agmcz on May 19, 2022, 03:14:54 pm
I'm still trying but something is confusing...  :o

this code is working successfully with Android Studio
Code: [Select]
TypedValue outValue = new TypedValue();
getBaseContext().getTheme().resolveAttribute(android.R.attr.selectableItemBackground, outValue, true);
ImageView myimage = (ImageView) findViewById(R.id.imageView);
myimage.setForeground(getDrawable(outValue.resourceId));
myimage.setClickable(true);

but with LAMW it is not working successfully  :o
Code: [Select]
TypedValue outValue = new TypedValue();
controls.activity.getTheme().resolveAttribute(R.attr.selectableItemBackground, outValue, true);
this.setForeground(controls.activity.getResources().getDrawable(outValue.resourceId));
this.setClickable(true);
Title: Re: LAMW - How to set effect to imageview
Post by: Agmcz on May 28, 2022, 07:45:27 pm
Ok :D finished!
the problem was from event onTouchEvent :)

ImageView.java
1- Disable event onTouchEvent
Code: [Select]
/*
public  boolean onTouchEvent( MotionEvent event) {
...
}
*/
                  

2- Add onClickListener event in constructor
Code: [Select]
onClickListener = new OnClickListener() {
  public  void onClick(View view) {
    controls.pOnClick(PasObj,Const.Click_Default);
  }
};
setOnClickListener(onClickListener);

3- Add new proc
Code: [Select]
public void SetRippleEffect() {
  TypedValue typedValue = new TypedValue();
  controls.activity.getTheme().resolveAttribute(R.attr.selectableItemBackground, typedValue, true);
  int[] attrs = new int[]{R.attr.selectableItemBackground};
  TypedArray typedArray = controls.activity.obtainStyledAttributes(typedValue.resourceId, attrs);
  this.setForeground(typedArray.getDrawable(0));
  this.setClickable(true);
  typedArray.recycle();
}

Laz_And_Controls.pas
Code: [Select]
procedure jImageView.SetRippleEffect;
begin
  if FInitialized then
    jni_proc(gApp.jni.jEnv, FjObject, 'SetRippleEffect');
end;

Using:
Code: [Select]
ImageView1.SetRippleEffect;
Title: Re: LAMW - How to set effect to imageview
Post by: jmpessoa on May 29, 2022, 12:27:37 am
Quote
Ok :D finished!

Nice!

Please, can you post here a simple [demo] project....


Thank you!
Title: Re: LAMW - How to set effect to imageview
Post by: Agmcz on May 29, 2022, 02:16:15 am
Quote from: jmpessoa on May 29, 2022, 12:27:37 am
Please, can you post here a simple [demo] project....
Demo attached.
Title: Re: LAMW - How to set effect to imageview
Post by: jmpessoa on May 30, 2022, 07:19:22 am
Quote
Demo attached.

Done!

Added to LAMW github: new demo  "AppImageViewRippleEffectDemo1" !

Note: updated/fixed "onTouchEvent"  in   "jImageView.java"   to  support ripple effect!!!


Thank you!!!!
TinyPortal © 2005-2018