Imugui에서 탭 구름 단추 구름을 실현하는 예

개요
다음은 Imugui를 사용할 때 라벨 클라우드 부품을 설치하고자 하는 경우의 실시 사례를 소개한다.

https://youtu.be/CtPyvXL9qWE

설치 예
소스 코드

작문 시간의 실장: usagi::imgui::small_button_cloud - 13961fdb0daa6c132c283204445e4aab6fc76a8d

namespace usagi
{
  namespace imgui
  {
    class small_button_cloud
      : public std::multimap
        < std::string
        , std::function< auto () -> void >
        >
    {
      float _width = 0.0f;
    public:
      auto width() { return _width; }
      auto width( const decltype( _width ) in ) { return _width = in; }
      auto get_width_pointer() { return &_width; }
      auto operator()()
      {
        ImGui::BeginGroup();

        const auto s = ImGui::GetStyle();
        const auto iis2 = s.ItemInnerSpacing.x * 2;
        const auto is   = s.ItemSpacing.x;

        auto current_line_width = 0.0f;

        for ( const auto& p : *this )
        {
          const auto entity_width = ImGui::CalcTextSize( p.first.c_str() ).x;
          const auto tmp_line_width = current_line_width + is + iis2 + entity_width;

          if ( current_line_width > 0.0f and tmp_line_width < _width )
          {
            ImGui::SameLine();
            current_line_width = tmp_line_width;
          }
          else
            current_line_width = iis2 + entity_width;

          if ( ImGui::SmallButton( p.first.c_str() ) )
            p.second();
        }

        ImGui::EndGroup();
      }
    };
  }
}

사용된 ImuGi API 그룹

ImGui::SmallButton

ImGui::BeginGroup

ImGui::EndGroup

ImGui::CalcTextSize

ImGui::GetStyle

ImGui::SameLine

실제 tips

임의의width구역에서 라벨과 클릭할 때의 선풍기 멀티캐스트SmallButton에서 라벨 구름식의 작은 버튼 구름을 실현한다.

SmallButton의 가로 너비는 CalcTextSize()+GetStyle().ItemInnerSpacing*2SmallButton가 정의하기 전에 계산할 수 있다.

가로로 여러 개SmallButtonSameLine의 항목 사이의 간격은 GetStyle().ItemSpacing에서 얻을 수 있다.

여러 치수의 도해

동작 테스트

  using usagi::imgui::small_button_cloud;

  static small_button_cloud c;

  ImGui::SliderFloat( "width", c.get_width_pointer(), 0.0f, 1024.0f );

  if ( c.empty() )
    for ( auto n = 0; n < 32; ++n )
      c.emplace( "hoge-" + std::to_string( n ), [=]{ std::cerr << "hoge-" << n << '\n'; } );

  c();

https://youtu.be/CtPyvXL9qWE