Sketch of markdown images impl

app/build.gradle

@@ -17,4 +17,5 @@ android {
 dependencies {
     compile project(':library-renderer')
     compile 'ru.noties:debug:3.0.0@jar'
+    compile 'com.squareup.picasso:picasso:2.5.2'
 }

app/src/main/AndroidManifest.xml

@@ -3,6 +3,8 @@
     xmlns:android="http://schemas.android.com/apk/res/android"
     package="ru.noties.markwon">
 
+    <uses-permission android:name="android.permission.INTERNET"/>
+
     <application
         android:allowBackup="true"
         android:icon="@mipmap/ic_launcher"

app/src/main/assets/scrollable.md

@@ -0,0 +1,282 @@
+![logo](art/scrollable_big_logo.png)
+
+[![Maven Central](https://img.shields.io/maven-central/v/ru.noties/scrollable.svg)](http://search.maven.org/#search|ga|1|g%3A%22ru.noties%22%20AND%20a%3A%22scrollable%22)
+
+---
+
+**Scrollable** is a library for an Android application to implement various scrolling technicks. It's all started with **scrolling tabs**, but now much more can be done with it. Scrollable supports all scrolling and non-scrolling views, including: **RecyclerView**, **ScrollView**, **ListView**, **WebView**, etc and any combination of those inside a **ViewPager**. Library is designed to let developer implement desired effect without imposing one solution. Library is small and has no dependencies.
+
+## Preview
+
+All GIFs here are taken from `sample` application module.
+
+
+<img src="art/scrollable_colorful.gif" width="30%" alt="colorful_sample"/> <img src="art/scrollable_custom_overscroll.gif" width="30%" alt="custom_overscroll_sample"/> <img src="art/scrollable_dialog.gif" width="30%" alt="dialog_sample"/>
+
+<sup>*Serving suggestion</sup>
+
+## Installation
+```groovy
+compile 'ru.noties:scrollable:1.3.0`
+```
+
+## Usage
+
+To start using this library `ScrollableLayout` must be aded to your layout.
+
+```xml
+<?xml version="1.0" encoding="utf-8"?>
+<ru.noties.scrollable.ScrollableLayout
+    android:id="@+id/scrollable_layout"
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent"
+    app:scrollable_autoMaxScroll="true"
+    app:scrollable_defaultCloseUp="true">
+
+    <ru.noties.scrollable.sample.SampleHeaderView
+        style="@style/HeaderStyle"
+        app:shv_title="@string/sample_title_fragment_pager"/>
+
+    <ru.noties.scrollable.sample.TabsLayout
+        android:id="@+id/tabs"
+        android:layout_width="match_parent"
+        android:layout_height="@dimen/tabs_height"
+        android:background="@color/md_teal_500"/>
+
+    <android.support.v4.view.ViewPager
+        android:id="@+id/view_pager"
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"
+        android:layout_marginTop="@dimen/tabs_height"/>
+
+</ru.noties.scrollable.ScrollableLayout>
+```
+
+Please note, that `ScrollableLayout` positions its children like vertical `LinearLayout`, but measures them like a `FrameLayout`. It is crucial that scrolling content holder dimentions must be set to `match_parent` (minus possible *sticky* view that should be extracted from it, for example, by specifying `android:layoutMarginTop="height_of_sticky_view"`).
+
+Next, `ScrollableLayout` must be initialized in code:
+
+```java
+final ScrollableLayout scrollableLayout = findView(R.id.scrollable_layout);
+
+// this listener is absolute minimum that is required for `ScrollableLayout` to function
+scrollableLayout.setCanScrollVerticallyDelegate(new CanScrollVerticallyDelegate() {
+    @Override
+    public boolean canScrollVertically(int direction) {
+        // Obtain a View that is a scroll container (RecyclerView, ListView, ScrollView, WebView, etc)
+        // and call its `canScrollVertically(int) method.
+        // Please note, that if `ViewPager is used, currently displayed View must be obtained
+        // because `ViewPager` doesn't delegate `canScrollVertically` method calls to it's children
+        final View view = getCurrentView();
+        return view.canScrollVertically(direction);
+    }
+});
+```
+
+
+### Draggable View
+
+This is a View, that can be *dragged* to change `ScrollableLayout` scroll state. For example, to expand header if tabs are dragged. To add this simply call:
+```java
+// Please note that `tabsLayout` must be a child (direct or indirect) of a ScrollableLayout
+scrollableLayout.setDraggableView(tabsLayout);
+```
+
+
+### OnScrollChangedListener
+
+In order to apply custom logic for different scroll state of a `ScrollableLayout` `OnScrollChangedListener` can be used (to change color of a header, create parallax effect, sticky tabs, etc)
+
+```java
+scrollableLayout.addOnScrollChangedListener(new OnScrollChangedListener() {
+    @Override
+    public void onScrollChanged(int y, int oldY, int maxY) {
+
+        // `ratio` of current scroll state (from 0.0 to 1.0)
+        // 0.0 - means fully expanded
+        // 1.0 - means fully collapsed
+        final float ratio = (float) y / maxY;
+
+        // for example, we can hide header, if we are collapsed
+        // and show it when we are expanded (plus intermediate state)
+        header.setAlpha(1.F - ratio);
+
+        // to create a `sticky` effect for tabs this calculation can be used:
+        final float tabsTranslationY;
+        if (y < maxY) {
+            // natural position
+            tabsTranslationY = .0F;
+        } else {
+            // sticky position
+            tabsTranslationY = y - maxY;
+        }
+        tabsLayout.setTranslationY(tabsTranslationY);
+    }
+});
+```
+
+
+### OnFlingOverListener
+
+To *continue* a fling event for a scrolling container `OnFlingOverListener` can be used.
+
+```java
+scrollableLayout.setOnFlingOverListener(new OnFlingOverListener() {
+    @Override
+    public void onFlingOver(int y, long duration) {
+        recyclerView.smoothScrollBy(0, y);
+    }
+});
+```
+
+
+### OverScrollListener
+
+To create custom *overscroll* handler (for example, like in `SwipeRefreshLayout` for loading, or to zoom-in header when cannot scroll further) `OverScrollListener` can be used
+
+```java
+scrollableLayout.setOverScrollListener(new OverScrollListener() {
+    @Override
+    public void onOverScrolled(ScrollableLayout layout, int overScrollY) {
+
+    }
+
+    @Override
+    public boolean hasOverScroll(ScrollableLayout layout, int overScrollY) {
+        return false;
+    }
+
+    @Override
+    public void onCancelled(ScrollableLayout layout) {
+
+    }
+
+    @Override
+    public void clear() {
+
+    }
+});
+```
+
+`OverScrollListener` gives you full controll of overscrolling, but it implies a lot of handling. For a simple case `OverScrollListenerBase` can be used
+
+```java
+scrollableLayout.setOverScrollListener(new OverScrollListenerBase() {
+    @Override
+    protected void onRatioChanged(ScrollableLayout layout, float ratio) {
+
+    }
+});
+```
+
+For example, this is `onRatioChanged` method from `ZoomInHeaderOverScrollListener` from `sample` application:
+```java
+@Override
+protected void onRatioChanged(ScrollableLayout layout, float ratio) {
+    final float scale = 1.F + (.33F * ratio);
+    mHeader.setScaleX(scale);
+    mHeader.setScaleY(scale);
+
+    final int headerHeight = mHeader.getHeight();
+    mContent.setTranslationY(((headerHeight * scale) - headerHeight) / 2.F);
+}
+```
+
+### Scrolling Header
+
+There is support for scrolling header. This means that if header can scroll, it will scroll first to the final position and only after that scroll event will be redirected. There are no extra steps to enable this feature if scrolling header is the first view in `ScrollableLayout`. Otherwise a XML attribute `app:scrollable_scrollingHeaderId` can be used, it accepts an id of a view.
+
+
+## Various customizations
+
+### CloseUpAlgorithm
+
+In order to *close-up* `ScrollableLayout` (do not leave in intermediate state, allow only two scrolling states: collapsed & expanded, etc), `CloseUpAlgorithm` can be used. Its signature is as follows:
+
+```java
+public interface CloseUpAlgorithm {
+
+    int getFlingFinalY(ScrollableLayout layout, boolean isScrollingBottom, int nowY, int suggestedY, int maxY);
+
+    int getIdleFinalY(ScrollableLayout layout, int nowY, int maxY);
+}
+```
+
+And usage is like this:
+
+```java
+scrollableLayout.setCloseUpAlgorithm(new MyCloseUpAlgorithm());
+```
+
+Library provides a `DefaultCloseUpAlgorithm` for a most common usage (to allow `ScrollableLayout` only 2 scrolling states: collapsed and expanded). It can be set via java code: `scrollableLayout.setCloseUpAlgorithm(new DefaultCloseUpAlgorithm())`  and via XML with `app:scrollable_defaultCloseUp="true"`.
+
+Also, there is an option to set duration after which CloseUpAlgorithm should be evaluated (idle state - no touch events). Java: `scrollableLayout.setConsiderIdleMillis(100L)` and XML: `app:scrollable_considerIdleMillis="100"`. `100L` is the default value and may be omitted.
+
+If *close-up* need to have different animation times, `CloseUpIdleAnimationTime` can be used. Its signature:
+
+```java
+public interface CloseUpIdleAnimationTime {
+    long compute(ScrollableLayout layout, int nowY, int endY, int maxY);
+}
+```
+If animation time is constant (do not depend on current scroll state), `SimpleCloseUpIdleAnimationTime` can be used. Java: `scrollableLayout.setCloseUpIdleAnimationTime(new SimpleCloseUpIdleAnimationTime(200L))`, XML: `app:app:scrollable_closeUpAnimationMillis="200"`. `200L` is default value and can be omitted.
+
+If one want to get control of `ValueAnimator` that is used to animate between scroll states, `CloseUpAnimatorConfigurator` can be used. Its signature:
+
+```java
+public interface CloseUpAnimatorConfigurator {
+    // when called will already have a duration set
+    void configure(ValueAnimator animator);
+}
+```
+
+If only `Interpolator` must be configured, a `InterpolatorCloseUpAnimatorConfigurator` can be used. Java: `scrollableLayout.setCloseAnimatorConfigurator(new InterpolatorCloseUpAnimatorConfigurator(interpolator))`, XML: `app:scrollable_closeUpAnimatorInterpolator="app:scrollable_closeUpAnimatorInterpolator="@android:interpolator/decelerate_cubic"`
+
+
+### Auto Max Scroll
+
+If you layout has a header with dynamic height, or it's height should be obtained at runtime, there is an option to automatically obtain it. Java: `scrollableLayout.setAutoMaxScroll(true)`, XML: `app:scrollable_autoMaxScroll="true"`. With this option there is no need manually set `maxScrollY`. Please note, that if not specified explicitly this option will be set to `true` if `maxScroll` option is not set (equals `0`). Also, if at runtime called `scrollableLayout.setMaxScroll(int)`, `autoMaxScroll` if set to `true`, will be set to `false`.
+
+By default the first View will be used to calculate height, but if different one must be used, there is an option to specify `id` of this view. XML: `app:scrollable_autoMaxScrollViewId="@id/header"`
+
+
+### Disable Handling
+
+If `ScrollableLayout` must not evaluate its scrolling logic (skip all touch events), `scrollableLayout.setSelfUpdateScroll(boolean)` can be used. Pass `true` to disable all handling, `false` to enable it.
+
+
+### Animate Scroll
+
+To animate scroll state of a `ScrollableLayout`, `animateScroll(int)` can be used:
+
+```java
+// returns ValueAnimator, that can be configured as desired
+// `0` - expand fully
+// `scrollableLayout.getMaxScroll()` - collapse
+scrollableLayout.animateScroll(0)
+        .setDuration(250L)
+        .start();
+```
+
+Please note that `ScrollableLayout` caches returned `ValueAnimator` and reuses it. First of all because it doesn't make sense to have two different scrolling animations on one `ScrollableLayout`. So, it's advisable to clear all possible custom state before running animation (just like `View` handles `ViewPropertyAnimator`)
+
+
+## License
+
+```
+  Copyright 2015 Dimitry Ivanov (mail@dimitryivanov.ru)
+
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+```

app/src/main/assets/test.md

@@ -1,3 +1,5 @@
+![logo](https://github.com/noties/Scrollable/raw/master/art/scrollable_big_logo.png)
+
 # Hello!
 
 **bold *italic*** _just italic_

app/src/main/java/ru/noties/markwon/MainActivity.java

@@ -1,27 +1,35 @@
 package ru.noties.markwon;
 
 import android.app.Activity;
+import android.graphics.Bitmap;
+import android.graphics.drawable.BitmapDrawable;
 import android.graphics.drawable.Drawable;
+import android.net.Uri;
 import android.os.Bundle;
 import android.os.SystemClock;
-import android.text.SpannableStringBuilder;
+import android.support.annotation.NonNull;
-import android.text.Spanned;
 import android.text.method.LinkMovementMethod;
 import android.widget.TextView;
 
+import com.squareup.picasso.Picasso;
+import com.squareup.picasso.Target;
+
 import org.commonmark.ext.gfm.strikethrough.StrikethroughExtension;
 import org.commonmark.node.Node;
 import org.commonmark.parser.Parser;
 
 import java.io.IOException;
 import java.io.InputStream;
+import java.util.ArrayList;
 import java.util.Arrays;
+import java.util.List;
 import java.util.Scanner;
 
 import ru.noties.debug.AndroidLogDebugOutput;
 import ru.noties.debug.Debug;
 import ru.noties.markwon.renderer.*;
-import ru.noties.markwon.spans.DrawableSpan;
+import ru.noties.markwon.spans.AsyncDrawable;
+import ru.noties.markwon.spans.CodeSpan;
 import ru.noties.markwon.spans.DrawableSpanUtils;
 
 public class MainActivity extends Activity {
@@ -30,6 +38,8 @@ public class MainActivity extends Activity {
         Debug.init(new AndroidLogDebugOutput(true));
     }
 
+    private List<Target> targets = new ArrayList<>();
+
     @Override
     protected void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
@@ -43,7 +53,7 @@ public class MainActivity extends Activity {
 //        for (int i = 0; i < 10; i++) {
 //            builder.append("text here and icon: \u00a0");
 //            //noinspection WrongConstant
-//            builder.setSpan(new DrawableSpan(drawable, i % 3), builder.length() - 1, builder.length(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
+//            builder.setSpan(new AsyncDrawableSpan(drawable, i % 3), builder.length() - 1, builder.length(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
 //            builder.append('\n');
 //        }
 //        textView.setText(builder);
@@ -52,6 +62,15 @@ public class MainActivity extends Activity {
 //            return;
 //        }
 
+        final Picasso picasso = new Picasso.Builder(this)
+                .listener(new Picasso.Listener() {
+                    @Override
+                    public void onImageLoadFailed(Picasso picasso, Uri uri, Exception exception) {
+                        Debug.i(exception, uri);
+                    }
+                })
+                .build();
+
         new Thread(new Runnable() {
             @Override
             public void run() {
@@ -59,7 +78,7 @@ public class MainActivity extends Activity {
                 Scanner scanner = null;
                 String md = null;
                 try {
-                    stream = getAssets().open("test.md");
+                    stream = getAssets().open("scrollable.md");
                     scanner = new Scanner(stream).useDelimiter("\\A");
                     if (scanner.hasNext()) {
                         md = scanner.next();
@@ -82,8 +101,53 @@ public class MainActivity extends Activity {
                             .build();
                     final Node node = parser.parse(md);
 
+                    final SpannableConfiguration configuration = SpannableConfiguration.builder(MainActivity.this)
+                            .setAsyncDrawableLoader(new AsyncDrawable.Loader() {
+                                @Override
+                                public void load(@NonNull String destination, @NonNull final AsyncDrawable drawable) {
+                                    Debug.i(destination);
+                                    final Target target = new Target() {
+                                        @Override
+                                        public void onBitmapLoaded(Bitmap bitmap, Picasso.LoadedFrom from) {
+                                            Debug.i();
+                                            final Drawable d = new BitmapDrawable(getResources(), bitmap);
+                                            d.setBounds(0, 0, d.getIntrinsicWidth(), d.getIntrinsicHeight());
+                                            drawable.setResult(d);
+//                                            textView.setText(textView.getText());
+                                        }
+
+                                        @Override
+                                        public void onBitmapFailed(Drawable errorDrawable) {
+                                            Debug.i();
+                                        }
+
+                                        @Override
+                                        public void onPrepareLoad(Drawable placeHolderDrawable) {
+                                            Debug.i();
+                                        }
+                                    };
+                                    targets.add(target);
+
+                                            picasso.load(destination)
+                                            .tag(destination)
+                                            .into(target);
+
+                                }
+
+                                @Override
+                                public void cancel(@NonNull String destination) {
+                                    Debug.i(destination);
+                                    picasso
+                                            .cancelTag(destination);
+                                }
+                            })
+                            .setCodeConfig(CodeSpan.Config.builder().setTextSize(
+                                    (int) (getResources().getDisplayMetrics().density * 14 + .5F)
+                            ).setMultilineMargin((int) (getResources().getDisplayMetrics().density * 8 + .5F)).build())
+                            .build();
+
                     final CharSequence text = new ru.noties.markwon.renderer.SpannableRenderer().render(
-                            SpannableConfiguration.create(MainActivity.this),
+                            configuration,
                             node
                     );
 

app/src/main/java/ru/noties/markwon/SpannableRenderer.java

@@ -49,7 +49,7 @@
 //import ru.noties.debug.Debug;
 //import ru.noties.markwon.spans.BlockQuoteSpan;
 //import ru.noties.markwon.spans.CodeSpan;
-//import ru.noties.markwon.spans.DrawableSpan;
+//import ru.noties.markwon.spans.AsyncDrawableSpan;
 //import ru.noties.markwon.spans.EmphasisSpan;
 //import ru.noties.markwon.spans.BulletListItemSpan;
 //import ru.noties.markwon.spans.StrongEmphasisSpan;
@@ -367,7 +367,7 @@
 //
 ////            final int length = builder.length();
 //            final TestDrawable drawable = new TestDrawable();
-//            final DrawableSpan span = new DrawableSpan(drawable);
+//            final AsyncDrawableSpan span = new AsyncDrawableSpan(drawable);
 //            builder.append("  ");
 //            builder.setSpan(span, length, builder.length(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
 //        }

app/src/main/res/layout/activity_main.xml

@@ -10,9 +10,9 @@
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:layout_margin="16dip"
-        android:textSize="18sp"
+        android:textSize="16sp"
         android:lineSpacingExtra="2dip"
-        android:textColor="@color/colorPrimaryDark"
+        android:textColor="#333"
         tools:context="ru.noties.markwon.MainActivity"
         tools:text="yo\nman" />
 

library-renderer/src/main/java/ru/noties/markwon/renderer/AsyncDrawableLoaderNoOp.java

@@ -0,0 +1,17 @@
+package ru.noties.markwon.renderer;
+
+import android.support.annotation.NonNull;
+
+import ru.noties.markwon.spans.AsyncDrawable;
+
+class AsyncDrawableLoaderNoOp implements AsyncDrawable.Loader {
+    @Override
+    public void load(@NonNull String destination, @NonNull AsyncDrawable drawable) {
+
+    }
+
+    @Override
+    public void cancel(@NonNull String destination) {
+
+    }
+}

library-renderer/src/main/java/ru/noties/markwon/renderer/SpannableConfiguration.java

@@ -3,6 +3,7 @@ package ru.noties.markwon.renderer;
 import android.content.Context;
 import android.support.annotation.NonNull;
 
+import ru.noties.markwon.spans.AsyncDrawable;
 import ru.noties.markwon.spans.BlockQuoteSpan;
 import ru.noties.markwon.spans.BulletListItemSpan;
 import ru.noties.markwon.spans.CodeSpan;
@@ -27,6 +28,7 @@ public class SpannableConfiguration {
     private final HeadingSpan.Config headingConfig;
     private final ThematicBreakSpan.Config thematicConfig;
     private final OrderedListItemSpan.Config orderedListConfig;
+    private final AsyncDrawable.Loader asyncDrawableLoader;
 
     private SpannableConfiguration(Builder builder) {
         this.blockQuoteConfig = builder.blockQuoteConfig;
@@ -35,6 +37,7 @@ public class SpannableConfiguration {
         this.headingConfig = builder.headingConfig;
         this.thematicConfig = builder.thematicConfig;
         this.orderedListConfig = builder.orderedListConfig;
+        this.asyncDrawableLoader = builder.asyncDrawableLoader;
     }
 
     public BlockQuoteSpan.Config getBlockQuoteConfig() {
@@ -61,6 +64,10 @@ public class SpannableConfiguration {
         return orderedListConfig;
     }
 
+    public AsyncDrawable.Loader getAsyncDrawableLoader() {
+        return asyncDrawableLoader;
+    }
+
     public static class Builder {
 
         private final Context context;
@@ -70,6 +77,7 @@ public class SpannableConfiguration {
         private HeadingSpan.Config headingConfig;
         private ThematicBreakSpan.Config thematicConfig;
         private OrderedListItemSpan.Config orderedListConfig;
+        private AsyncDrawable.Loader asyncDrawableLoader;
 
         public Builder(Context context) {
             this.context = context;
@@ -105,9 +113,15 @@ public class SpannableConfiguration {
             return this;
         }
 
+        public Builder setAsyncDrawableLoader(AsyncDrawable.Loader asyncDrawableLoader) {
+            this.asyncDrawableLoader = asyncDrawableLoader;
+            return this;
+        }
+
         // todo, change to something more reliable
         // todo, must mention that bullet/ordered/quote must have the same margin (or maybe we can just enforce it?)
         // actually it does make sense to have `blockQuote` & `list` margins (if they are different)
+        // todo, maybe move defaults to configuration classes?
         public SpannableConfiguration build() {
             if (blockQuoteConfig == null) {
                 blockQuoteConfig = new BlockQuoteSpan.Config(
@@ -133,6 +147,9 @@ public class SpannableConfiguration {
             if (orderedListConfig == null) {
                 orderedListConfig = new OrderedListItemSpan.Config(px(24), 0);
             }
+            if (asyncDrawableLoader == null) {
+                asyncDrawableLoader = new AsyncDrawableLoaderNoOp();
+            }
             return new SpannableConfiguration(this);
         }
 
@@ -140,4 +157,5 @@ public class SpannableConfiguration {
             return (int) (context.getResources().getDisplayMetrics().density * dp + .5F);
         }
     }
+
 }

library-renderer/src/main/java/ru/noties/markwon/renderer/SpannableMarkdownVisitor.java

@@ -3,7 +3,9 @@ package ru.noties.markwon.renderer;
 import android.support.annotation.NonNull;
 import android.text.SpannableStringBuilder;
 import android.text.Spanned;
+import android.text.TextUtils;
 import android.text.style.StrikethroughSpan;
+import android.text.style.URLSpan;
 
 import org.commonmark.ext.gfm.strikethrough.Strikethrough;
 import org.commonmark.node.AbstractVisitor;
@@ -16,6 +18,8 @@ import org.commonmark.node.FencedCodeBlock;
 import org.commonmark.node.HardLineBreak;
 import org.commonmark.node.Heading;
 import org.commonmark.node.HtmlBlock;
+import org.commonmark.node.Image;
+import org.commonmark.node.Link;
 import org.commonmark.node.ListBlock;
 import org.commonmark.node.ListItem;
 import org.commonmark.node.Node;
@@ -27,6 +31,8 @@ import org.commonmark.node.Text;
 import org.commonmark.node.ThematicBreak;
 
 import ru.noties.debug.Debug;
+import ru.noties.markwon.spans.AsyncDrawable;
+import ru.noties.markwon.spans.AsyncDrawableSpan;
 import ru.noties.markwon.spans.BlockQuoteSpan;
 import ru.noties.markwon.spans.BulletListItemSpan;
 import ru.noties.markwon.spans.CodeSpan;
@@ -131,7 +137,9 @@ public class SpannableMarkdownVisitor extends AbstractVisitor {
 
         final int length = builder.length();
 
+        builder.append('\u00a0').append('\n');
         builder.append(fencedCodeBlock.getLiteral());
+        builder.append('\u00a0').append('\n');
         setSpan(length, new CodeSpan(
                 configuration.getCodeConfig(),
                 true
@@ -141,21 +149,6 @@ public class SpannableMarkdownVisitor extends AbstractVisitor {
         builder.append('\n');
     }
 
-//    @Override
-//    public void visit(Image image) {
-//
-//        Debug.i(image);
-//
-////        final int length = builder.length();
-//
-//        visitChildren(image);
-//
-////        if (length == builder.length()) {
-////            // nothing is added, and we need at least one symbol
-////            builder.append(' ');
-////        }
-//    }
-
     @Override
     public void visit(BulletList bulletList) {
         visitList(bulletList);
@@ -167,7 +160,7 @@ public class SpannableMarkdownVisitor extends AbstractVisitor {
     }
 
     private void visitList(Node node) {
-        Debug.i(node);
+//        Debug.i(node);
         newLine();
         visitChildren(node);
         newLine();
@@ -179,7 +172,7 @@ public class SpannableMarkdownVisitor extends AbstractVisitor {
     @Override
     public void visit(ListItem listItem) {
 
-        Debug.i(listItem);
+//        Debug.i(listItem);
 
         final int length = builder.length();
 
@@ -308,6 +301,23 @@ public class SpannableMarkdownVisitor extends AbstractVisitor {
         }
     }
 
+    @Override
+    public void visit(Image image) {
+
+        final int length = builder.length();
+
+        visitChildren(image);
+
+        // if image has no link, create it (to open in external app)
+
+        // we must check if anything _was_ added, as we need at least one char to render
+        if (length == builder.length()) {
+            builder.append(' '); // breakable space
+        }
+
+        setSpan(length, new AsyncDrawableSpan(new AsyncDrawable(image.getDestination(), configuration.getAsyncDrawableLoader())));
+    }
+
     @Override
     public void visit(HtmlBlock htmlBlock) {
         // http://spec.commonmark.org/0.18/#html-blocks
@@ -315,6 +325,13 @@ public class SpannableMarkdownVisitor extends AbstractVisitor {
         super.visit(htmlBlock);
     }
 
+    @Override
+    public void visit(Link link) {
+        final int length = builder.length();
+        visitChildren(link);
+        setSpan(length, new URLSpan(link.getDestination()));
+    }
+
     private void setSpan(int start, @NonNull Object span) {
         builder.setSpan(span, start, builder.length(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
     }

library-spans/src/main/java/ru/noties/markwon/spans/AsyncDrawable.java

@@ -0,0 +1,127 @@
+package ru.noties.markwon.spans;
+
+import android.graphics.Canvas;
+import android.graphics.ColorFilter;
+import android.graphics.PixelFormat;
+import android.graphics.drawable.Drawable;
+import android.support.annotation.IntRange;
+import android.support.annotation.NonNull;
+import android.support.annotation.Nullable;
+
+public class AsyncDrawable extends Drawable {
+
+    public interface Loader {
+        void load(@NonNull String destination, @NonNull AsyncDrawable drawable);
+
+        void cancel(@NonNull String destination);
+    }
+
+    private final String destination;
+    private final Loader loader;
+
+    private Drawable result;
+
+    public AsyncDrawable(@NonNull String destination, @NonNull Loader loader) {
+        this.destination = destination;
+        this.loader = loader;
+    }
+
+    public String getDestination() {
+        return destination;
+    }
+
+    public Drawable getResult() {
+        return result;
+    }
+
+    public boolean hasResult() {
+        return result != null;
+    }
+
+    public boolean isAttached() {
+        return getCallback() != null;
+    }
+
+    // yeah
+    public void setCallback2(@Nullable Callback callback) {
+
+        super.setCallback(callback);
+
+        // if not null -> means we are attached
+        if (callback != null) {
+            loader.load(destination, this);
+        } else {
+            if (result != null) {
+                result.setCallback(null);
+            }
+            loader.cancel(destination);
+        }
+    }
+
+    public void setResult(Drawable result) {
+
+        // if we have previous one, detach it
+        if (this.result != null) {
+            this.result.setCallback(null);
+        }
+
+        this.result = result;
+        this.result.setCallback(getCallback());
+
+        // should we copy the data here? like bounds etc?
+        // if we are async and we load some image from some source
+        // thr bounds might change... so we are better off copy `result` bounds to this instance
+        setBounds(result.getBounds());
+        invalidateSelf();
+    }
+
+    @Override
+    public void draw(@NonNull Canvas canvas) {
+        if (hasResult()) {
+            result.draw(canvas);
+        }
+    }
+
+    @Override
+    public void setAlpha(@IntRange(from = 0, to = 255) int alpha) {
+
+    }
+
+    @Override
+    public void setColorFilter(@Nullable ColorFilter colorFilter) {
+
+    }
+
+    @Override
+    public int getOpacity() {
+        final int opacity;
+        if (hasResult()) {
+            opacity = result.getOpacity();
+        } else {
+            opacity = PixelFormat.TRANSPARENT;
+        }
+        return opacity;
+    }
+
+    @Override
+    public int getIntrinsicWidth() {
+        final int out;
+        if (hasResult()) {
+            out = result.getIntrinsicWidth();
+        } else {
+            out = 0;
+        }
+        return out;
+    }
+
+    @Override
+    public int getIntrinsicHeight() {
+        final int out;
+        if (hasResult()) {
+            out = result.getIntrinsicHeight();
+        } else {
+            out = 0;
+        }
+        return out;
+    }
+}

library-spans/src/main/java/ru/noties/markwon/spans/AsyncDrawableSpan.java

@@ -0,0 +1,119 @@
+package ru.noties.markwon.spans;
+
+import android.graphics.Canvas;
+import android.graphics.Paint;
+import android.graphics.Rect;
+import android.graphics.drawable.Drawable;
+import android.support.annotation.IntDef;
+import android.support.annotation.IntRange;
+import android.support.annotation.NonNull;
+import android.support.annotation.Nullable;
+import android.text.style.ReplacementSpan;
+
+@SuppressWarnings("WeakerAccess")
+public class AsyncDrawableSpan extends ReplacementSpan {
+
+    @IntDef({ ALIGN_BOTTOM, ALIGN_BASELINE, ALIGN_CENTER })
+    @interface Alignment {}
+
+    public static final int ALIGN_BOTTOM = 0;
+    public static final int ALIGN_BASELINE = 1;
+    public static final int ALIGN_CENTER = 2; // will only center if drawable height is less than text line height
+
+    private final AsyncDrawable drawable;
+    private final int alignment;
+
+    public AsyncDrawableSpan(@NonNull AsyncDrawable drawable) {
+        this(drawable, ALIGN_BOTTOM);
+    }
+
+    public AsyncDrawableSpan(@NonNull AsyncDrawable drawable, @Alignment int alignment) {
+        this.drawable = drawable;
+        this.alignment = alignment;
+
+        // additionally set intrinsic bounds if empty
+        final Rect rect = drawable.getBounds();
+        if (rect.isEmpty()) {
+            drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight());
+        }
+    }
+
+    @Override
+    public int getSize(
+            @NonNull Paint paint,
+            CharSequence text,
+            @IntRange(from = 0) int start,
+            @IntRange(from = 0) int end,
+            @Nullable Paint.FontMetricsInt fm) {
+
+        // if we have no async drawable result - we will just render text
+
+        final int size;
+
+        if (drawable.hasResult()) {
+
+            final Rect rect = drawable.getBounds();
+
+            if (fm != null) {
+                fm.ascent = -rect.bottom;
+                fm.descent = 0;
+
+                fm.top = fm.ascent;
+                fm.bottom = 0;
+            }
+
+            size = rect.right;
+
+        } else {
+
+            size = (int) (paint.measureText(text, start, end) + .5F);
+
+        }
+
+        return size;
+    }
+
+    @Override
+    public void draw(
+            @NonNull Canvas canvas,
+            CharSequence text,
+            @IntRange(from = 0) int start,
+            @IntRange(from = 0) int end,
+            float x,
+            int top,
+            int y,
+            int bottom,
+            @NonNull Paint paint) {
+
+        final AsyncDrawable drawable = this.drawable;
+
+        if (drawable.hasResult()) {
+
+            final int b = bottom - drawable.getBounds().bottom;
+
+            final int save = canvas.save();
+            try {
+                final int translationY;
+                if (ALIGN_CENTER == alignment) {
+                    translationY = b - ((bottom - top - drawable.getBounds().height()) / 2);
+                } else if (ALIGN_BASELINE == alignment) {
+                    translationY = b - paint.getFontMetricsInt().descent;
+                } else {
+                    translationY = b;
+                }
+                canvas.translate(x, translationY);
+                drawable.draw(canvas);
+            } finally {
+                canvas.restoreToCount(save);
+            }
+        } else {
+
+            final int textY = (int) (bottom - ((bottom - top) / 2) - ((paint.descent() + paint.ascent()) / 2.F + .5F));
+            canvas.drawText(text, start, end, x, textY, paint);
+        }
+    }
+
+    public AsyncDrawable getDrawable() {
+        return drawable;
+    }
+}

library-spans/src/main/java/ru/noties/markwon/spans/DrawableSpan.java

@@ -1,98 +0,0 @@
-package ru.noties.markwon.spans;
-
-import android.graphics.Canvas;
-import android.graphics.Paint;
-import android.graphics.Rect;
-import android.graphics.drawable.Drawable;
-import android.support.annotation.IntDef;
-import android.support.annotation.IntRange;
-import android.support.annotation.NonNull;
-import android.support.annotation.Nullable;
-import android.text.style.ReplacementSpan;
-
-@SuppressWarnings("WeakerAccess")
-public class DrawableSpan extends ReplacementSpan {
-
-    @IntDef({ ALIGN_BOTTOM, ALIGN_BASELINE, ALIGN_CENTER })
-    @interface Alignment {}
-
-    public static final int ALIGN_BOTTOM = 0;
-    public static final int ALIGN_BASELINE = 1;
-    public static final int ALIGN_CENTER = 2; // will only center if drawable height is less than text line height
-
-    private final Drawable drawable;
-    private final int alignment;
-
-    public DrawableSpan(@NonNull Drawable drawable) {
-        this(drawable, ALIGN_BOTTOM);
-    }
-
-    public DrawableSpan(@NonNull Drawable drawable, @Alignment int alignment) {
-        this.drawable = drawable;
-        this.alignment = alignment;
-
-        // additionally set intrinsic bounds if empty
-        final Rect rect = drawable.getBounds();
-        if (rect.isEmpty()) {
-            drawable.setBounds(0, 0, drawable.getIntrinsicWidth(), drawable.getIntrinsicHeight());
-        }
-    }
-
-    @Override
-    public int getSize(
-            @NonNull Paint paint,
-            CharSequence text,
-            @IntRange(from = 0) int start,
-            @IntRange(from = 0) int end,
-            @Nullable Paint.FontMetricsInt fm) {
-
-        final Rect rect = drawable.getBounds();
-
-        if (fm != null) {
-            fm.ascent = -rect.bottom;
-            fm.descent = 0;
-
-            fm.top = fm.ascent;
-            fm.bottom = 0;
-        }
-
-        return rect.right;
-    }
-
-    @Override
-    public void draw(
-            @NonNull Canvas canvas,
-            CharSequence text,
-            @IntRange(from = 0) int start,
-            @IntRange(from = 0) int end,
-            float x,
-            int top,
-            int y,
-            int bottom,
-            @NonNull Paint paint) {
-
-        final Drawable drawable = this.drawable;
-
-        final int b = bottom - drawable.getBounds().bottom;
-
-        final int save = canvas.save();
-        try {
-            final int translationY;
-            if (ALIGN_CENTER == alignment) {
-                translationY = b - ((bottom - top - drawable.getBounds().height()) / 2);
-            } else if (ALIGN_BASELINE == alignment) {
-                translationY = b - paint.getFontMetricsInt().descent;
-            } else {
-                translationY = b;
-            }
-            canvas.translate(x, translationY);
-            drawable.draw(canvas);
-        } finally {
-            canvas.restoreToCount(save);
-        }
-    }
-
-    public Drawable getDrawable() {
-        return drawable;
-    }
-}

library-spans/src/main/java/ru/noties/markwon/spans/DrawableSpanUtils.java

@@ -33,11 +33,11 @@ public class DrawableSpanUtils {
         if (spans != null
                 && spans.length > 0) {
 
-            final List<Drawable> list = new ArrayList<>(2);
+            final List<AsyncDrawable> list = new ArrayList<>(2);
 
             for (Object span: spans) {
-                if (span instanceof DrawableSpan) {
+                if (span instanceof AsyncDrawableSpan) {
-                    list.add(((DrawableSpan) span).getDrawable());
+                    list.add(((AsyncDrawableSpan) span).getDrawable());
                 }
             }
 
@@ -53,14 +53,14 @@ public class DrawableSpanUtils {
                     public void onViewDetachedFromWindow(View v) {
                         // remove callbacks...
                         textView.removeOnAttachStateChangeListener(this);
-                        for (Drawable drawable: list) {
+                        for (AsyncDrawable drawable: list) {
-                            drawable.setCallback(null);
+                            drawable.setCallback2(null);
                         }
                     }
                 });
 
-                for (Drawable drawable: list) {
+                for (AsyncDrawable drawable: list) {
-                    drawable.setCallback(new DrawableCallbackImpl(textView, drawable.getBounds()));
+                    drawable.setCallback2(new DrawableCallbackImpl(textView, drawable.getBounds()));
                 }
             }
         }

library-spans/src/main/java/ru/noties/markwon/spans/EmphasisSpan.java

@@ -7,11 +7,11 @@ public class EmphasisSpan extends MetricAffectingSpan {
 
     @Override
     public void updateMeasureState(TextPaint p) {
-        p.setTextSkewX(-0.25f);
+        p.setTextSkewX(-0.25F);
     }
 
     @Override
     public void updateDrawState(TextPaint tp) {
-        tp.setTextSkewX(-0.25f);
+        tp.setTextSkewX(-0.25F);
     }
 }