Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Graph Editor Property Panel Formatting #1346

Conversation

kwokcb
Copy link
Contributor

@kwokcb kwokcb commented Apr 28, 2023

Add some table formatting for property panel in graph editor.

  • Shows 2 columns with either the connection type (as before) or the value (as before). Second column is aligned right and first column aligned left.
  • Table has vertical scroll-bar.

Sample New Formatting

  • Marble node graph
    image
  • Marble std surf
    image
  • Image node (showing browser)
    image

Vs old formatting

image
image
image

@kwokcb
Copy link
Contributor Author

kwokcb commented Apr 28, 2023

@lfl-eholthouser, @jstone-lucasfilm . I have pulled out the formatting UI work into this separate PR.
The biggest change is to not use estimated indentation and switch to using tables which provides column support and alignment.

@@ -818,7 +818,7 @@ void Graph::updateMaterials(mx::InputPtr input, mx::ValuePtr value)
void Graph::setConstant(UiNodePtr node, mx::InputPtr& input, const mx::UIProperties& uiProperties)
{
std::string inName = !uiProperties.uiName.empty()? uiProperties.uiName : input->getName();
float labelWidth = ImGui::CalcTextSize(inName.c_str()).x;
ImGui::PushItemWidth(-1);
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Right alignment is "easy" by using -1.

@@ -854,13 +851,10 @@ void Graph::setConstant(UiNodePtr node, mx::InputPtr& input, const mx::UIPropert
if (val && val->isA<int>())
{
int prev = val->asA<int>(), temp = val->asA<int>();
ImGui::SameLine();
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

All of these "same lines" are not needed in general since items are added into table cells.

@@ -3134,63 +3110,94 @@ void Graph::propertyEditor()
}
}

const float TEXT_BASE_HEIGHT = ImGui::GetTextLineHeightWithSpacing() * 1.3f;
const int SCROLL_LINE_COUNT= 20;
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This can be tweaked as needed. About 20 items seems reasonable now for a scroll area, and the table has no borders. I assume when UI grouping support is added these can be collapsible areas and scroll bars may not be needed as much since each group has less items. For another PR.

@@ -3274,7 +3320,9 @@ void Graph::propertyEditor()

if (ImGui::BeginPopup("docstring"))
{
ImGui::SetWindowFontScale(_fontScale);
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Minor update to make the font size more readable.

@jstone-lucasfilm
Copy link
Member

This looks great to me, @kwokcb, and I'd be interested in thoughts from @lfl-eholthouser as well.

@lfl-eholthouser
Copy link
Contributor

This looks great to me as well! Thanks! @kwokcb

@jstone-lucasfilm jstone-lucasfilm merged commit f6d08cb into AcademySoftwareFoundation:main May 4, 2023
@kwokcb kwokcb deleted the editor_property_panel_formatting branch May 5, 2023 03:22
Michaelredaa pushed a commit to Michaelredaa/MaterialX that referenced this pull request Oct 21, 2023
Add some table formatting for property panel in graph editor.
* Shows 2 columns with either the connection type (as before) or the value (as before). Second column is aligned right and first column aligned left.
* Table has vertical scroll-bar.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants