Skip to content
This repository has been archived by the owner on Apr 14, 2020. It is now read-only.

Commit

Permalink
Add chinese and english readme.
Browse files Browse the repository at this point in the history
  • Loading branch information
LeeReindeer committed Jan 3, 2018
1 parent 602a35e commit 84a44bf
Show file tree
Hide file tree
Showing 3 changed files with 170 additions and 26 deletions.
132 changes: 132 additions & 0 deletions README-ZH.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,132 @@
# Tree2View

[![Build Status](https://travis-ci.org/LeeReindeer/Tree2View.svg?branch=master)](https://travis-ci.org/LeeReindeer/Tree2View)

> TreeView implementation in Android.
## 主要功能

|Tree2View|文件管理器(一个例子)|
|--------|----------|
|①多级分层的树结构视图 | 基本的文件管理器布局|
|②记忆展开状态 | 自动展开上次打开未关闭的目录|
|③使用适配器设计模式,用户可自定义 TreeAdapter | 对不同类型的文件显示不同的Icon |
|④动态增删节点 | 删除和添加文件后可自动刷新状态 |
|⑤选择模式 | 长按节点进行文件操作(Copy, Cut, Rename, Delete) |
|⑥动画支持,内置增删节点的动画 | 增删文件时带有动画 |

[一个更简单的例子](/demo/app/src/main/java/xyz/leezoom/tree2view_demo/MainActivity.java)

## 实现原理

- TreeView 继承自 ListView

- DFS遍历可展开的树节点,转化为List 与 [TreeAdapter](https://github.com/LeeReindeer/Tree2View/blob/master/treeview/src/main/java/xyz/leezoom/view/treeview/adapter/TreeAdapter.java) 进行适配。

- 分级的视觉效果通过 [SimpleTreeAdapter](https://github.com/LeeReindeer/Tree2View/blob/master/treeview/src/main/java/xyz/leezoom/view/treeview/adapter/SimpleTreeAdapter.java)(通过对不同深度的节点设置不同的**缩进**)来实现的。

- 使用 [DefaultTreeNode](https://github.com/LeeReindeer/Tree2View/blob/master/treeview/src/main/java/xyz/leezoom/view/treeview/module/DefaultTreeNode.java) 来(用链表保存子节点)增删节点。这样就实现了视觉效果和数据结构统一的设计。

## 效果预览 - Preview

![](https://github.com/LeeReindeer/Tree2View/blob/master/screenshot/tree2view_demo1.png)

![](https://github.com/LeeReindeer/Tree2View/blob/master/screenshot/tree2view_demo2.png)

## 下载

> 未上传到 `jCenter()`
1. 可直接clone本项目使用。

```git
git clone [email protected]:LeeReindeer/Tree2View.git
```

2. 打开 Android Studio, 依次点击 `FIle` -> `New` -> `Import Module`, 导入这个 module 即可。

3.`build.gradle` 里添加依赖

```groovy
implementation project(path: ':treeview')
//或者
compile project(path: ':treeview')
```

## 使用

1.`xml` 中添加,和 `ListView` 类似的.

```xml
<xyz.leezoom.view.treeview.TreeView
android:id="@+id/tree_view"
android:layout_marginTop="16dp"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:divider="#ffffff"
android:dividerHeight="1px">

</xyz.leezoom.view.treeview.TreeView>
```
2. 在代码里添加初始化,这里使用Kotlin(Java 代码类似)

```kotlin
var root :DefaultTreeNode? = DefaultTreeNode("Root")
tree_view.root = root
val child1 = DefaultTreeNode("Child1")
val child2 = DefaultTreeNode("Child2")
//在你创建节点之后,你需要立即添加她
root.addChild(child1)
root.addChild(child2)
val child3 = DefaultTreeNode("Child3")
child1.addChild(child3)
//是否默认显示根节点的孩子
tree_view.isRootVisible = true
//默认的动画
tree_view.isDefaultAnimation = true
```

3. 设置监听器

`Tree2View` 有默认的点击监听器,你也可以自己实现,可以参考[这里](https://github.com/LeeReindeer/Tree2View/blob/master/app/src/main/java/xyz/leezoom/tree2/activity/MainActivity.kt#L111)

选择(长按)监听器需要自己实现。

4. 自定义使用

只需要实现 `TreeAapater` ,就那么简单。

```java
public class FileTreeAdapter extends TreeAdapter<FileItem> {
//resourceId 是 itemView 的 xml 视图。
public FileTreeAdapter(Context context, DefaultTreeNode root, int resourceId) {
super(context, root, resourceId);
}

@Override
public View getView(int position, View convertView, ViewGroup parent) {
//your code here
//...
//调用 setPadding 来设置缩进
setPadding(holder.arrowIcon, depth, -1);
//根据数据改变 view 的状态(比如图标什么的)
toggle(node, holder);
}

@Override
public void toggle(Object... objects) {
//需要自己实现
}
}
```

之后只要设置一下适配器:

```kotlin
val adapter = FileTreeAdapter(this@MainActivity, root, R.layout.layout_file_tree_item)
treeView.treeAdapter = adapter
```

## License

Apache 2.0
63 changes: 38 additions & 25 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,58 +3,64 @@
[![Build Status](https://travis-ci.org/LeeReindeer/Tree2View.svg?branch=master)](https://travis-ci.org/LeeReindeer/Tree2View)

> TreeView implementation in Android.
>
> [数据结构课程设计](http://leezoom.xyz/2018/01/02/%E6%95%B0%E6%8D%AE%E7%BB%93%E6%9E%84%E8%AF%BE%E7%A8%8B%E8%AE%BE%E8%AE%A1%E6%8A%A5%E5%91%8A/)
## 主要功能 - Features
[中文版](/README-ZH.md)

|TreeView|File Explorer|
## Features

|TreeView|File Explorer(Advanced Example)|
|--------|----------|
|多级分层的树结构视图 | 基本的文件管理器布局|
|记忆展开状态 | 自动展开上次打开未关闭的目录|
|使用适配器设计模式,用户可自定义 TreeAdapter | 对不同类型的文件显示不同的Icon |
|动态增删节点 | 删除和添加文件后可自动刷新状态 |
|选择模式 | 长按节点进行文件操作(Copy, Cut, Rename, Delete) |
|动画支持,内置增删节点的动画 | 增删文件时带有动画 |
|Multi-level tree view | Basic file manager layout|
|Remember expansion state | Automatically expand the last unclosed directory|
|Customize TreeAdapter | Different types of documents show different Icon |
|Dynamic add and delete nodes | refresh status after delete and add files |
|Select listener | Long press node for file operations (Copy, Cut, Rename, Delete) |
|Animation support | Add or delete files with animation |

You can also see [a more simple example](/demo/app/src/main/java/xyz/leezoom/tree2view_demo/MainActivity.java).

## 实现原理 - Implement
## Implement

- TreeView 继承自 ListView
- TreeView extends from ListView.

- DFS遍历可展开的树节点,转化为List 与 [TreeAdapter](https://github.com/LeeReindeer/Tree2View/blob/master/treeview/src/main/java/xyz/leezoom/view/treeview/adapter/TreeAdapter.java) 进行适配。
- DFS travel the expandable tree node, and convert it to List which adapt with [TreeAdapter](https://github.com/LeeReindeer/Tree2View/blob/master/treeview/src/main/java/xyz/leezoom/view/treeview/adapter/TreeAdapter.java).

- 分级的视觉效果通过 [SimpleTreeAdapter](https://github.com/LeeReindeer/Tree2View/blob/master/treeview/src/main/java/xyz/leezoom/view/treeview/adapter/SimpleTreeAdapter.java)(通过对不同深度的节点设置不同的**缩进**)来实现的。
- Use [SimpleTreeAdapter](https://github.com/LeeReindeer/Tree2View/blob/master/treeview/src/main/java/xyz/leezoom/view/treeview/adapter/SimpleTreeAdapter.java) ot set different indentation on nodes of different depths.

- 使用 [DefaultTreeNode](https://github.com/LeeReindeer/Tree2View/blob/master/treeview/src/main/java/xyz/leezoom/view/treeview/module/DefaultTreeNode.java) 来(用链表保存子节点)增删节点。这样就实现了视觉效果和数据结构统一的设计。
- Use LinkedList to store node's children, see [DefaultTreeNode](https://github.com/LeeReindeer/Tree2View/blob/master/treeview/src/main/java/xyz/leezoom/view/treeview/module/DefaultTreeNode.java).

## 效果预览 - Preview
## Preview

![](https://github.com/LeeReindeer/Tree2View/blob/master/screenshot/tree2view_demo1.png)

![](https://github.com/LeeReindeer/Tree2View/blob/master/screenshot/tree2view_demo2.png)

## 下载 - Download
## Download

> To-do: upload to jCenter.
> 未上传到 `jCenter()`,可直接clone本项目使用。
1. But now, you can just clone this repo to use Tree2View.

```git
git clone [email protected]:LeeReindeer/Tree2View.git
```

Then open your project in Android Studio, then Click `FIle` -> `New` -> `Import Module`, to import this
2. Open your project in Android Studio, then Click `FIle` -> `New` -> `Import Module`, to import this
module.

And add dependence in your `build.gradle`
3. Add dependence in your `build.gradle`
```groovy
implementation project(path: ':treeview')
//or
compile project(path: ':treeview')
```

## 使用 - Usage
## Usage

1. Add in your xml:

Feel free to use it as `ListView`.

XML:
```xml
<xyz.leezoom.view.treeview.TreeView
android:id="@+id/tree_view"
Expand All @@ -67,20 +73,27 @@ XML:
</xyz.leezoom.view.treeview.TreeView>
```

Kotlin(Java is similar whit it)
2. Add children in Kotlin code(Java is similar whit it)
```kotlin
var root :DefaultTreeNode? = DefaultTreeNode("Root")
val treeView = TreeView(this@MainActivity, root)
tree_view.root = root
val child1 = DefaultTreeNode("Child1")
val child2 = DefaultTreeNode("Child2")
// After create a node your should immediately add it.
root.addChild(child1)
root.addChild(child2)
val child3 = DefaultTreeNode("Child3")
child1.addChild(child3)
//whether the root's children is expanded by default
tree_view.isRootVisible = true
//animation
tree_view.isDefaultAnimation = true
```
3. Add click listener and select listener

Tree2View has a default click listener, but it's ok to add your own.You can refer to [here](https://github.com/LeeReindeer/Tree2View/blob/master/app/src/main/java/xyz/leezoom/tree2/activity/MainActivity.kt#L111).

If you want to use customized item view, you should implement `TreeAapater`, like this:
4. If you want to use customized item view, you should implement `TreeAapater`, like this:
```java
public class FileTreeAdapter extends TreeAdapter<FileItem> {
//resourceId is your customized view resourceId, please use RelativeLayout, and let view neighbour.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -159,7 +159,6 @@ public String travelNodeList(DefaultTreeNode first) {
* @return array of <code>TreeNode</code>
*/
public TreeNode[] getFullPath() {
// TODO: 12/14/17 bfs
return (TreeNode[]) TreeUtils.getAllNodesB(root).toArray();
}

Expand Down

0 comments on commit 84a44bf

Please sign in to comment.