# nachos

**Repository Path**: archermind-ti/nachos

## Basic Information

- **Project Name**: nachos
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Apache-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 1
- **Created**: 2021-07-21
- **Last Updated**: 2024-05-31

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# nachos

#### Introduce

Nachos is a library for APP that provides a custom TextView allowing users to enter text and create material chips in the text field.


#### Effect demonstration
![效果演示](images/editing_in_place.gif)

#### Installation

```groovy
Packages up your library into a har, and add the har to the directory entry libs,

Add implementation codes to directory entry/gradle:
implementation fileTree(dir: 'libs', include: ['*.jar', '*.har'])
```

Add this line to your module level build.gradle:

```groovy
allprojects{
    repositories{
        mavenCentral()
    }
}
dependencies { 
    implementation "com.gitee.archermind-ti:nachos:1.0.3"
}
```

#### Usage ####
* [Basic Usage](#TOC-BasicUsage)
  * [Customizing the UI](#TOC-BasicUsage-UICustomization)
  * [Listening for when a Chip is Touched](#TOC-BasicUsage-OnChipClickListener)
  * [Reading the Values of the Chips](#TOC-BasicUsage-ReadingValues)
  * [Using a Custom UI Element for the Chips](#TOC-BasicUsage-ChipCreator)
  * [Click Enter to hide textFiled](#TOC-BasicUsage-EnterClick)

## <a name="TOC-BasicUsage"></a>Basic Usage ##

Include a `NachoTextView` in your xml layout as follows:
```xml
<com.hootsuite.nachos.NachoTextView
  ohos:id="$+id:id_first_nachoTextView"
  ohos:height="match_content"
  ohos:width="match_parent"
  ohos:left_margin="10vp"
  ohos:right_margin="20vp"/>
```

#### <a name="TOC-BasicUsage-UICustomization"></a>Customizing the UI ####
NachoTextView offers several custom attributes that allow you to control the appearance of the chips it creates:
* `chipHorizontalSpacing` - The horizontal space between chips
* `chipBackground` - The background color of the chip, can be a ColorStateList to change color when the chip is clicked
* `chipCornerRadius` - The corner radius of the chip background
* `chipTextColor` - The color of the chip text
* `chipTextSize` - The font size of the chip text
* `chipHeight` - The height of a single chip
* `chipVerticalSpacing` - The vertical space between chips on consecutive lines.

Note: `chipVerticalSpacing` can only be used if `chipHeight` is also set

Use these attributes as follows:
```xml
<com.hootsuite.nachos.NachoTextView
    ohos:id="$+id:id_first_nachoTextView"
    ohos:width="match_parent"
    ohos:height="wrap_content"
    app:chipHorizontalSpacing="2dp"
    app:chipBackground="@color/chip_background"
    app:chipTextColor="@color/cheddar"
    app:chipTextSize="16dp"
    app:chipHeight="30dp"
    app:chipVerticalSpacing="3dp"/>
```

Don't forget to declare the app namespace on your root layout element:
```xml
<StackLayout
    xmlns:ohos="http://schemas.huawei.com/res/ohos"
    xmlns:app="http://schemas.huawei.com/res/ohos-auto"
    ohos:id="$+id:root"
    ohos:height="match_content"
    ohos:width="match_parent">
</StackLayout>
```

#### <a name="TOC-BasicUsage-OnChipClickListener"></a>Listening for when a Chip is Touched ####
If you want to perform any custom actions when a chip is clicked you can attach an `OnChipClickListener` to the NachoTextView:
```java
 nachosTextView.setOnChipClickListener(new OnChipClickListener() {
            @Override
            public void onChipClickListener(Component component) {
                
            }
        });
```

#### <a name="TOC-BasicUsage-ReadingValues"></a>Reading the Values of the Chips ####

NachoTextView exposes several methods to read the contents of the text view:
* `getAllChips()`
  * Returns the actual `Chip` objects contained in the text view
  * `Chip` is an interface that represents a chip and declares methods to access the text (`getText()`), data (`getData()`), and ui attributes of the chip
* `getChipValues()`
  * Returns a List of the string values of all the chips in the text
* `getTokenValues()`
  * Returns a List of the string values of all the tokens (unchipped text) in the text 
* `getChipAndTokenValues()`
  * Returns a combination of the chip values and token values in the text.
  * Effectively a concatenation of the previous two methods (`getChipValues()` and `getTokenValues()`)


#### <a name="TOC-BasicUsage-ChipCreator"></a>Using a Custom UI Element for the Chips ####

```java
    nachoTextView.setElement(ResourceTable.Media_fork);
```

#### <a name="TOC-BasicUsage-EnterClick"></a>Click Enter to hide textFiled ####

Click Enter to hide textField
##
![效果演示](./images/click_enter_chip.gif)

#### <a name="TOC-BasicUsage-ChipClick"></a>Click Enter to show textFiled ####

Click any chips to show textField
##
![效果演示](./images/click_enter_chip.gif)


## <a name="TOC-License"></a>License ##

Nachos is released under the Apache License, Version 2.0. See [LICENSE](LICENSE) for details.