虫ネガネアイコンを押すと、検索窓がニュッと出てきて検索可能にする便利なライブラリです。
イメージとしては↓の様な感じのもの(公式より)
app/build.gradleに以下を追加しライブラリをプロジェクトに追加
implementation 'br.com.mauker.materialsearchview:materialsearchview:1.2.3'
次にSuggestions用にContentProviderを使っているっぽいので、
br.com.mauker パッケージを作成し、MsvAuthority.kt を作成
package br.com.mauker
object MsvAuthority {
const val CONTENT_AUTHORITY: String = "${BuildConfig.APPLICATION_ID}.material_search_view"
}
AndroidManifestに以下を追加
<application ... >
<provider
android:name="br.com.mauker.materialsearchview.db.HistoryProvider"
android:authorities="${applicationId}.material_search_view"
android:exported="false"
android:protectionLevel="signature"
android:syncable="true"/>
</application>
STG/PRO用など、環境毎にアプリを共存させたいので以下の様に
android:authorities="${applicationId}.material_search_view"
BuildVariantで異なるアプリケーションIDをauthoritiesに含めて設定しておきます。
この時点でビルドして通ればOK 👌
1 SearchActivityの作成
<style name="MaterialSearchViewStyle">
<item name="searchBackground">@color/white_ish</item>
<item name="searchVoiceIcon">@drawable/ic_action_voice_search</item>
<item name="searchCloseIcon">@drawable/ic_action_navigation_close</item>
<item name="searchBackIcon">@drawable/ic_action_navigation_close</item>
<item name="searchSuggestionBackground">@color/search_layover_bg</item>
<item name="historyIcon">@drawable/ic_history_white</item>
<item name="suggestionIcon">@drawable/ic_action_search_white</item>
<item name="listTextColor">@color/white_ish</item>
<item name="searchBarHeight">?attr/actionBarSize</item>
<item name="voiceHintPrompt">@string/hint_prompt</item>
<item name="android:textColor">@color/black</item>
<item name="android:textColorHint">@color/gray_50</item>
<item name="android:hint">@string/search_hint</item>
<item name="android:inputType">textCapWords</item>
</style>
3 レイアウトファイルにMaterialSearchViewを追加
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="xxxxxxxxx.SearchActivity">
<androidx.appcompat.widget.Toolbar
android:id="@+id/searchToolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:background="@color/colorPrimary"
app:theme="@style/ToolbarTheme" />
<br.com.mauker.materialsearchview.MaterialSearchView
android:id="@+id/searchView"
android:layout_width="match_parent"
android:layout_height="match_parent"
style="@style/MaterialSearchViewStyle"/>
</androidx.constraintlayout.widget.ConstraintLayout>
4 res/menu/search_menu.xml の作成
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="@+id/action_search"
android:icon="@drawable/ic_action_search_white"
android:orderInCategory="100"
android:title="@string/abc_search_hint"
app:showAsAction="always" />
</menu>
5 SearchActivity の実装
class SearchActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_search)
initToolbar()
}
private fun initToolbar() {
setSupportActionBar(searchToolbar)
val actionBar = supportActionBar
if (actionBar != null) {
actionBar.setDisplayHomeAsUpEnabled(true)
actionBar.setHomeButtonEnabled(true)
actionBar.setTitle(R.string.back)
searchToolbar.setNavigationOnClickListener {
finish()
}
}
}
override fun onCreateOptionsMenu(menu: Menu?): Boolean {
menuInflater.inflate(R.menu.search_menu, menu)
return true
}
override fun onOptionsItemSelected(item: MenuItem?): Boolean {
when (item?.itemId) {
R.id.action_search -> {
searchView.openSearch()
return true
}
}
return super.onOptionsItemSelected(item)
}
override fun onBackPressed() {
if (searchView.isOpen) {
searchView.closeSearch()
} else {
super.onBackPressed()
}
}
}
ここまで実装が終えたら動かしてみると、検索結果は何も表示されず
検索窓だけある画面が表示されます。✨
app/build.gradleに以下が追加されるdynamicFeatures = [":dynamic_feature"]
apply plugin: 'com.android.dynamic-feature'
android {
compileSdkVersion 27
defaultConfig {
minSdkVersion 21
targetSdkVersion 27
versionCode 1
versionName "1.0"
}
}
dependencies {
implementation fileTree(dir: 'libs', include: ['*.jar'])
implementation project(':app')
}
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:dist="http://schemas.android.com/apk/distribution"
package="com.example.dynamic_feature">
<dist:module
dist:onDemand="true"
dist:title="@string/title_dynamic_feature">
<dist:fusing dist:include="true" />
</dist:module>
</manifest>
$ node -v
v9.5.0
$ npm i @google/clasp -g
$ clasp logout
~/.clasprc.jsonは削除された$ clasp login
$ clasp list
$ mkdir ts-sample
$ cd ts-sample
$ clasp create ts-sample
Error: Permission denied. Enable the Apps Script API:
https://script.google.com/home/usersettings
$ clasp pull
$ yarn add typescript @types/google-apps-script
$ yarn add tslint --dev
$ ./node_modules/.bin/tslint --init
.clasp.jsonにrootDirを追加{
"scriptId":"xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx",
"rootDir": "src"
}
$ clasp push
.
├── android
│ └── spec
├── gcc_cmake
│ └── spec
├── rails
│ └── spec
...
├── specfiles #spec用の共通して使用するファイル
│ └── spec
version: 2
jobs:
build:
working_directory: ~/workspace
branches:
only:
- develop
docker:
- image: circleci/ruby:2.4
steps:
- checkout
- setup_remote_docker
# Download and cache dependencies
- restore_cache:
keys:
- v1-dependencies-{{ checksum "Gemfile.lock" }}
- v1-dependencies-
# Install dependencies
- run:
name: bundle install
command: bundle install --path vendor/bundle
- save_cache:
paths:
- vendor/bundle
key: v1-dependencies-{{ checksum "Gemfile.lock" }}
# Test
- run:
name: run test
command: ./run-tests.sh
# Deploy
- run:
name: deploy docker images
command: ./deploy.sh
setup_remote_docker を設定#!/usr/bin/env bash
WORKDIR=$PWD
# Find target directory.
for entity in `find . -type d -mindepth 1 -maxdepth 1 -not -name ".git"`; do
if [ $entity = "./specfiles" ]; then
# Ignore directory
continue
fi
# Only exist spec directory.
if [ -e $entity/spec ]; then
# Copy specfiles.
cp $WORKDIR/specfiles/.rspec $entity/.
cp -r $WORKDIR/specfiles/spec $entity/.
# Build docker image.
cd $entity
./docker-build.sh
cd $WORKDIR
# Exec rspec
bundle exec rspec --default-path $entity/spec
fi
done
spec ディレクトリがある環境だけ cp $WORKDIR/specfiles/.rspec $entity/.
cp -r $WORKDIR/specfiles/spec $entity/.
#!/usr/bin/env bash
docker login -u $DOCKER_USER -p $DOCKER_PASS
# Android
docker push slowhand/android:1.0
# Rails
docker push slowhand/rails:1.0
# gcc + cmake
docker push slowhand/gcc_cmake:1.0
$DOCKER_USER などの環境変数はCircleCI上で定義してます。
環境構築firebase-toolsをインストール$ npm install -g firebase-tools
$ firebase login
~/.config/configstore/ここにfirebase login すると新しいのが作成される。$ firebase init functions
You're about to initialize a Firebase project in this directory:
/xxxxxxx/xxxxxx/xxxxx
=== Project Setup
First, let's associate this project directory with a Firebase project.
You can create multiple project aliases by running firebase use --add,
but for now we'll just set up a default project.
? Select a default Firebase project for this directory: xxxxxx (xxxxxxxx)
=== Functions Setup
A functions directory will be created in your project with a Node.js
package pre-configured. Functions can be deployed with firebase deploy.
✔ Wrote functions/package.json
✔ Wrote functions/index.js
? Do you want to install dependencies with npm now? Yes
実装Hello worldやってみる。firebase init functionsで作成されたfunctions/index.js に実装されてexports.helloWorld = functions.https.onRequest((request, response) => {
response.send("Hello from Firebase!");
});
$ firebase deploy --only functions
Functionsを選択すると先ほどデプロイされたHello worldがデプロイされていればOK!
Hello from Firebase!が表示されるはず。firebase serve を使うexports.hello = functions.https.onRequest((request, response) => {
response.status(200).send('hogehoge!');
});
functionsディレクトリ直下で firebase serve --only functions コマンドを実行したいけど、$ npm --prefix functions run serve
functions ディレクトリの package.json の scripts の serve を実行してくれる "main": "lib/index.js",
"scripts": {
"serve": "firebase serve --only functions",
"shell": "firebase experimental:functions:shell",
"build": "./node_modules/.bin/tsc"
},
Typescript などを使っている場合は "main": "lib/index.js", とする事でi functions: Preparing to emulate functions.
✔ functions: sampleHandler: http://localhost:5000/xxxxxxx/us-central1/sampleHandler
バッドノウハウfirebase serve --only functions コマンドを実行するとエラー1Error: No project active, but project aliases are available.
Run firebase use <alias> with one of these options:
xxxxx (xxxxxx)
xxxxx (xxxxxx)
$ firebase use <project>
~/.config/configstore/firebase-tools.json の activeProjects にパスが設定される!firebase serve --only functions コマンドを実行するとエラー2⚠ functions: Cannot start emulator. Error: Cannot find module '@google-cloud/functions-emulator/src/config'
(node:49529) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 2): TypeError: Cannot read property 'exit' of undefined
