(by @andrestaltz)
If you prefer to watch video tutorials with live-coding, then check out this series I recorded with the same contents as in this article: Egghead.io - Introduction to Reactive Programming.
<!-- | |
We will use the directive in HTML in the following way | |
lazy-load here is our directive name and source is our input to the directive and it contains the original source URL --> | |
<img lazy-load [source]="srcUrl"> |
document.addEventListener("DOMContentLoaded", function() { | |
const images = [].slice.call(document.querySelectorAll("lazy-image")); | |
if ("IntersectionObserver" in window) { | |
/** | |
We first check if API in available and then continue to create a simple IntersectionObserver | |
*/ | |
let lazyImageObserver = new IntersectionObserver((entries, observer) => { | |
entries.forEach(function(entry) { | |
if (entry.isIntersecting) { | |
let image = entry.target; |
import { Directive, ElementRef, Input, OnChanges, SimpleChanges } from '@angular/core'; | |
@Directive({ | |
selector: '[lazy-load]' // Attribute selector | |
}) | |
export class LazyLoadDirective implements OnChanges { | |
@Input('source') | |
source; | |
lazyImageObserver: any; | |
(by @andrestaltz)
If you prefer to watch video tutorials with live-coding, then check out this series I recorded with the same contents as in this article: Egghead.io - Introduction to Reactive Programming.
<?xml version="1.0" encoding="utf-8"?> | |
<resources> | |
<color name="white">#FFFFFFFF</color> | |
<color name="black">#FF000000</color> | |
<!--reds--> | |
<color name="material_red_50">#FFEBEE</color> | |
<color name="material_red_100">#FFCDD2</color> | |
<color name="material_red_200">#EF9A9A</color> |
import android.content.Context; | |
import android.support.v7.widget.CardView; | |
import android.util.AttributeSet; | |
import android.view.ViewGroup; | |
public class LemonadeCardView extends CardView { | |
public LemonadeCardView(Context context) { | |
super(context); | |
init(); |
import android.database.Cursor; | |
import android.database.DataSetObserver; | |
import android.support.v7.widget.RecyclerView; | |
/** | |
* Created by nilarnab on 7/8/16. | |
*/ | |
public abstract class GenericRecyclerViewCursorAdapter<Vh extends RecyclerView.ViewHolder> extends RecyclerView.Adapter<Vh> { | |
private Cursor mCursor; | |
private DataSetObserver mDataSetObserver; |