PuzzleView

Android Jigsaw puzzle support,inspired by Instagram's layout.

Github星跟蹤圖

PuzzleView

Android Jigsaw puzzle support,inspired by Instagram's layout.

Release to 2.0, now support slant mode and round cornors.

中文README

the apk file is here--->http://fir.im/puzzle0607

Screenshots

Due the size of the gif file, the example below may not render well, in that case you can view the demo video on youtube.

Click here to see video demo



Now support slant mode and round cornors


Usage

in build.gradle

compile 'com.flying.xiaopo:puzzle:2.0.0-alpha'

in xml layout

 <com.xiaopo.flying.puzzle.PuzzleView
        android:id="@+id/puzzle"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

 <com.xiaopo.flying.puzzle.SquarePuzzleView
        android:id="@+id/square_puzzle"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

in the java code, you can change some attributes of the puzzle view

puzzleView.setPuzzleLayout(puzzleLayout);
puzzleView.setTouchEnable(true);
puzzleView.setNeedDrawLine(false);
puzzleView.setNeedDrawOuterLine(false);
puzzleView.setLineSize(4);
puzzleView.setLineColor(Color.BLACK);
puzzleView.setSelectedLineColor(Color.BLACK);
puzzleView.setHandleBarColor(Color.BLACK);
puzzleView.setAnimateDuration(300);

and handle some actions

puzzleView.rotate(90f);
puzzleView.flipHorizontally();
puzzleView.flipVertically();
puzzleView.setLineSize(currentDegrees);
puzzleView.setPieceRadian(currentDegrees);
puzzleView.setNeedDrawLine(!mPuzzleView.isNeedDrawLine());
puzzleView.replace(bitmap);

Also you can check the source code of the demo for examples of how to use these attributes.

Layout

The PuzzleView depends on the PuzzleLayout. Of course you can customize it.

If you don't want to customize it's layout, you can just use the default layout.

All the built-in layouts can be found in the the demo's PlaygroundActivity. You can click to see the effect.

Custom Layout

To create a custom layout is also easy. Just extend PuzzleLayout and override the layout method.

The PuzzleLayout class provides some methods for customization.
Also you can check the source code of the in-built layouts for guidance / examples.

public class CustomLayout extends PuzzleLayout {

    @Override
    public void layout() {
        addLine(getOuterBorder(), Line.Direction.HORIZONTAL, 1f / 2);
        addLine(getBorder(0), Line.Direction.VERTICAL, 1f / 2);
    }
}

Finally

to see some photos by puzzle
Click here

Update

  • 2017/08/29 2.0.0-alpha add slant mode puzzle, and to support round cornors
  • 2017/04/15 1.1.1 add piece select listener
  • 2017/02/15 1.1.0 add piece padding function

License

Copyright 2016 wuapnjie

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.

主要指標

概覽
名稱與所有者wuapnjie/PuzzleView
主編程語言Java
編程語言Java (語言數: 1)
平台
許可證
所有者活动
創建於2016-08-19 08:41:57
推送於2017-12-19 09:11:26
最后一次提交2017-12-19 17:11:09
發布數0
用户参与
星數862
關注者數23
派生數185
提交數103
已啟用問題?
問題數47
打開的問題數10
拉請求數3
打開的拉請求數0
關閉的拉請求數0
项目设置
已啟用Wiki?
已存檔?
是復刻?
已鎖定?
是鏡像?
是私有?